How to Use WaveGenerator.io

1. Choose a Wave Shape

Start by selecting the wave style you want — such as classic curves, smooth sine waves, or triangle waves. Each shape creates a different visual effect.

2. Customize Colors

Pick your primary and secondary colors. Use the color pickers to choose solid colors or a gradient. The preview updates instantly.

3. Adjust Layers & Height

Use the sliders to set the number of wave layers and the height (amplitude) of the waves. More layers create a deeper parallax effect.

4. Set Animation (Optional)

Toggle the animation switch to enable or disable wave motion. Adjust the speed slider to control how fast the waves move.

5. Choose Direction

Choose left-to-right or right-to-left wave movement for animated waves. This affects how the wave animation flows.

6. Download or Embed

Click Download to save your wave as an SVG file. You can also export your wave as a PNG or WebP image. Or copy the responsive embed code to paste into your website.

7. Preview Live

The live preview shows exactly how your wave will look. It’s responsive and updates instantly as you make changes.