SVG Wave Generator
FreeGenerate smooth SVG waves for website sections
Live preview
<svg viewBox="0 0 1440 320" xmlns="http://www.w3.org/2000/svg"> <path fill="#6366f1" d="M0,160.0 L0,160.0 L8,157.2 L16,154.4 L24,151.7 L32,149.0 L40,146.3 L48,143.7 L56,141.2 L64,138.8 L72,136.5 L80,134.3 L88,132.2 L96,130.3 L104,128.5 L112,126.8 L120,125.4 L128,124.0 L136,122.9 L144,122.0 L152,121.2 L160,120.6 L168,120.2 L176,120.0 L184,120.0 L192,120.2 L200,120.6 L208,121.2 L216,122.0 L224,122.9 L232,124.0 L240,125.4 L248,126.8 L256,128.5 L264,130.3 L272,132.2 L280,134.3 L288,136.5 L296,138.8 L304,141.2 L312,143.7 L320,146.3 L328,149.0 L336,151.7 L344,154.4 L352,157.2 L360,160.0 L368,162.8 L376,165.6 L384,168.3 L392,171.0 L400,173.7 L408,176.3 L416,178.8 L424,181.2 L432,183.5 L440,185.7 L448,187.8 L456,189.7 L464,191.5 L472,193.2 L480,194.6 L488,196.0 L496,197.1 L504,198.0 L512,198.8 L520,199.4 L528,199.8 L536,200.0 L544,200.0 L552,199.8 L560,199.4 L568,198.8 L576,198.0 L584,197.1 L592,196.0 L600,194.6 L608,193.2 L616,191.5 L624,189.7 L632,187.8 L640,185.7 L648,183.5 L656,181.2 L664,178.8 L672,176.3 L680,173.7 L688,171.0 L696,168.3 L704,165.6 L712,162.8 L720,160.0 L728,157.2 L736,154.4 L744,151.7 L752,149.0 L760,146.3 L768,143.7 L776,141.2 L784,138.8 L792,136.5 L800,134.3 L808,132.2 L816,130.3 L824,128.5 L832,126.8 L840,125.4 L848,124.0 L856,122.9 L864,122.0 L872,121.2 L880,120.6 L888,120.2 L896,120.0 L904,120.0 L912,120.2 L920,120.6 L928,121.2 L936,122.0 L944,122.9 L952,124.0 L960,125.4 L968,126.8 L976,128.5 L984,130.3 L992,132.2 L1000,134.3 L1008,136.5 L1016,138.8 L1024,141.2 L1032,143.7 L1040,146.3 L1048,149.0 L1056,151.7 L1064,154.4 L1072,157.2 L1080,160.0 L1088,162.8 L1096,165.6 L1104,168.3 L1112,171.0 L1120,173.7 L1128,176.3 L1136,178.8 L1144,181.2 L1152,183.5 L1160,185.7 L1168,187.8 L1176,189.7 L1184,191.5 L1192,193.2 L1200,194.6 L1208,196.0 L1216,197.1 L1224,198.0 L1232,198.8 L1240,199.4 L1248,199.8 L1256,200.0 L1264,200.0 L1272,199.8 L1280,199.4 L1288,198.8 L1296,198.0 L1304,197.1 L1312,196.0 L1320,194.6 L1328,193.2 L1336,191.5 L1344,189.7 L1352,187.8 L1360,185.7 L1368,183.5 L1376,181.2 L1384,178.8 L1392,176.3 L1400,173.7 L1408,171.0 L1416,168.3 L1424,165.6 L1432,162.8 L1440,160.0 L1440,320 L0,320 Z"/> </svg>
About SVG Wave Generator
Those smooth wave dividers between page sections are a popular design touch, but plotting the curves by hand in an SVG path is painful to get smooth. This generator creates flowing SVG waves for website sections so you can add a polished divider without wrestling with bezier math.
Shape the wave to your liking and copy the SVG code into your page as a section separator or background accent. Since it's SVG, the wave scales cleanly across screen sizes and can be recolored with CSS. The tool is free, runs in your browser without an account, and outputs ready-to-paste SVG markup, no design software or image exports needed.
Common uses
- Add a smooth wave divider between two page sections
- Create a flowing accent at the top or bottom of a hero area
- Generate decorative SVG separators that scale across screen sizes
- Style section transitions with recolorable vector waves
How to use
- 1
Configure options
Set your preferences using the options panel below.
- 2
Click Generate
Click the process button to generate your result instantly.
- 3
Copy or download
Copy the result to clipboard or download it directly to your device.
Why ToolHub?
- Instant generation
- Copy-ready output
- No login required
FAQ
How do I add the wave to my page?
Copy the generated SVG markup and place it in your HTML where you want the divider, typically between sections or as a background accent.
Can I change the wave's color?
Yes. Because it's SVG, you can set its fill color in CSS or directly in the markup to match your design.
Will the wave look right on mobile?
SVG scales cleanly, so the wave stays smooth across screen sizes. You may still adjust sizing to suit different breakpoints.
Can I use SVG Wave Generator on mobile?
Yes — ToolHub is fully responsive and works on iPhone, Android, tablets and all modern browsers. No app install needed.