← All text tools

SVG wave generator

Layered waves for section dividers and backgrounds, as SVG, PNG or CSS.

  • Free
  • No sign-up
  • Works on any device

About SVG wave generator

Create layered wave shapes that separate sections of a web page without a hard straight line. Set the number of layers, height, smoothness and colours, then export SVG, PNG or CSS. SVG waves are small files and can stretch to full width using preserveAspectRatio set to none.

How to use SVG wave generator

  1. Set the options above. The result updates live.
  2. Change anything until it's just right.
  3. Copy the result or download it.

Why use this tool?

Also known as

Frequently asked questions

How do I make a wave divider full width?

Set the SVG width to 100 percent, give it a fixed height, and use preserveAspectRatio equal to none so the curve stretches with the screen instead of leaving gaps.

Is SVG wave generator free?

Yes. SVG wave generator on Toolipedia is free to use, with no sign-up and no watermark.

Is it safe to use?

Yes. Everything is worked out in your browser, and nothing you enter is sent to our server.

Does it work on my phone?

Yes. It works in any modern browser on Android and iPhone, as well as on tablets and computers. There's nothing to install.

Do I need an account?

No. Just open the page and use the tool. There's no sign-up and no email needed.

Related tools