Wave SVG Generator

Fast, accurate and free online wave svg generator tool running directly in your browser.

Secure (SSL)

Client-Side Processing

100% Free

Go to tool

Instructions

1

Enter data
Enter content, paste text or load a file from disk.
2

Click the button
The tool will immediately process your data in the browser.
3

Get the result
Copy the finished text or save the file to your device.

                                                function runTool() {

                                                  return "Result ready in 0.1s";

                                                }

Settings

Layers

Reverse

Width

Height

Amplitude

Frequency

Smoothness

Color 1

Color 2

Color 3

Base transparency

Transparency step

Background

X offset

Animation

Speed

Result

svg: <svg xmlns="http://www.w3.org/2000/svg" width="1440" height="300" viewBox="0 0 1440 300" preserveAspectRatio="none" role="img" aria-label="Generated SVG waves"> <rect width="100%" height="100%" fill="#0f172a"></rect> <path d="M 0 300 L 0.00 211.19 L 9.60 210.70 L 19.20 210.62 L 28.80 210.96 L 38.40 211.70 L 48.00 212.85 L 57.60 214.38 L 67.20 216.26 L 76.80 218.47 L 86.40 220.98 L 96.00 223.73 L 105.60 226.70 L 115.20 229.83 L 124.80 233.07 L 134.40 236.37 L 144.00 239.68 L 153.60 242.95 L 163.20 246.13 L 172.80 249.16 L 182.40 252.00 L 192.00 254.61 L 201.60 256.93 L 211.20 258.95 L 220.80 260.61 L 230.40 261.91 L 240.00 262.81 L 249.60 263.30 L 259.20 263.38 L 268.80 263.04 L 278.40 262.30 L 288.00 261.15 L 297.60 259.62 L 307.20 257.74 L 316.80 255.53 L 326.40 253.02 L 336.00 250.27 L 345.60 247.30 L 355.20 244.17 L 364.80 240.93 L 374.40 237.63 L 384.00 234.32 L 393.60 231.05 L 403.20 227.87 L 412.80 224.84 L 422.40 222.00 L 432.00 219.39 L 441.60 217.07 L 451.20 215.05 L 460.80 213.39 L 470.40 212.09 L 480.00 211.19 L 489.60 210.70 L 499.20 210.62 L 508.80 210.96 L 518.40 211.70 L 528.00 212.85 L 537.60 214.38 L 547.20 216.26 L 556.80 218.47 L 566.40 220.98 L 576.00 223.73 L 585.60 226.70 L 595.20 229.83 L 604.80 233.07 L 614.40 236.37 L 624.00 239.68 L 633.60 242.95 L 643.20 246.13 L 652.80 249.16 L 662.40 252.00 L 672.00 254.61 L 681.60 256.93 L 691.20 258.95 L 700.80 260.61 L 710.40 261.91 L 720.00 262.81 L 729.60 263.30 L 739.20 263.38 L 748.80 263.04 L 758.40 262.30 L 768.00 261.15 L 777.60 259.62 L 787.20 257.74 L 796.80 255.53 L 806.40 253.02 L 816.00 250.27 L 825.60 247.30 L 835.20 244.17 L 844.80 240.93 L 854.40 237.63 L 864.00 234.32 L 873.60 231.05 L 883.20 227.87 L 892.80 224.84 L 902.40 222.00 L 912.00 219.39 L 921.60 217.07 L 931.20 215.05 L 940.80 213.39 L 950.40 212.09 L 960.00 211.19 L 969.60 210.70 L 979.20 210.62 L 988.80 210.96 L 998.40 211.70 L 1008.00 212.85 L 1017.60 214.38 L 1027.20 216.26 L 1036.80 218.47 L 1046.40 220.98 L 1056.00 223.73 L 1065.60 226.70 L 1075.20 229.83 L 1084.80 233.07 L 1094.40 236.37 L 1104.00 239.68 L 1113.60 242.95 L 1123.20 246.13 L 1132.80 249.16 L 1142.40 252.00 L 1152.00 254.61 L 1161.60 256.93 L 1171.20 258.95 L 1180.80 260.61 L 1190.40 261.91 L 1200.00 262.81 L 1209.60 263.30 L 1219.20 263.38 L 1228.80 263.04 L 1238.40 262.30 L 1248.00 261.15 L 1257.60 259.62 L 1267.20 257.74 L 1276.80 255.53 L 1286.40 253.02 L 1296.00 250.27 L 1305.60 247.30 L 1315.20 244.17 L 1324.80 240.93 L 1334.40 237.63 L 1344.00 234.32 L 1353.60 231.05 L 1363.20 227.87 L 1372.80 224.84 L 1382.40 222.00 L 1392.00 219.39 L 1401.60 217.07 L 1411.20 215.05 L 1420.80 213.39 L 1430.40 212.09 L 1440.00 211.19 L 1440 300 Z" fill="#6366f1" fill-opacity="0.90"></path> <path d="M 0 300 L 0.00 217.74 L 9.60 213.54 L 19.20 209.32 L 28.80 205.16 L 38.40 201.13 L 48.00 197.28 L 57.60 193.69 L 67.20 190.39 L 76.80 187.46 L 86.40 184.92 L 96.00 182.83 L 105.60 181.21 L 115.20 180.10 L 124.80 179.50 L 134.40 179.44 L 144.00 179.90 L 153.60 180.88 L 163.20 182.37 L 172.80 184.35 L 182.40 186.77 L 192.00 189.61 L 201.60 192.82 L 211.20 196.35 L 220.80 200.13 L 230.40 204.13 L 240.00 208.26 L 249.60 212.46 L 259.20 216.68 L 268.80 220.84 L 278.40 224.87 L 288.00 228.72 L 297.60 232.31 L 307.20 235.61 L 316.80 238.54 L 326.40 241.08 L 336.00 243.17 L 345.60 244.79 L 355.20 245.90 L 364.80 246.50 L 374.40 246.56 L 384.00 246.10 L 393.60 245.12 L 403.20 243.63 L 412.80 241.65 L 422.40 239.23 L 432.00 236.39 L 441.60 233.18 L 451.20 229.65 L 460.80 225.87 L 470.40 221.87 L 480.00 217.74 L 489.60 213.54 L 499.20 209.32 L 508.80 205.16 L 518.40 201.13 L 528.00 197.28 L 537.60 193.69 L 547.20 190.39 L 556.80 187.46 L 566.40 184.92 L 576.00 182.83 L 585.60 181.21 L 595.20 180.10 L 604.80 179.50 L 614.40 179.44 L 624.00 179.90 L 633.60 180.88 L 643.20 182.37 L 652.80 184.35 L 662.40 186.77 L 672.00 189.61 L 681.60 192.82 L 691.20 196.35 L 700.80 200.13 L 710.40 204.13 L 720.00 208.26 L 729.60 212.46 L 739.20 216.68 L 748.80 220.84 L 758.40 224.87 L 768.00 228.72 L 777.60 232.31 L 787.20 235.61 L 796.80 238.54 L 806.40 241.08 L 816.00 243.17 L 825.60 244.79 L 835.20 245.90 L 844.80 246.50 L 854.40 246.56 L 864.00 246.10 L 873.60 245.12 L 883.20 243.63 L 892.80 241.65 L 902.40 239.23 L 912.00 236.39 L 921.60 233.18 L 931.20 229.65 L 940.80 225.87 L 950.40 221.87 L 960.00 217.74 L 969.60 213.54 L 979.20 209.32 L 988.80 205.16 L 998.40 201.13 L 1008.00 197.28 L 1017.60 193.69 L 1027.20 190.39 L 1036.80 187.46 L 1046.40 184.92 L 1056.00 182.83 L 1065.60 181.21 L 1075.20 180.10 L 1084.80 179.50 L 1094.40 179.44 L 1104.00 179.90 L 1113.60 180.88 L 1123.20 182.37 L 1132.80 184.35 L 1142.40 186.77 L 1152.00 189.61 L 1161.60 192.82 L 1171.20 196.35 L 1180.80 200.13 L 1190.40 204.13 L 1200.00 208.26 L 1209.60 212.46 L 1219.20 216.68 L 1228.80 220.84 L 1238.40 224.87 L 1248.00 228.72 L 1257.60 232.31 L 1267.20 235.61 L 1276.80 238.54 L 1286.40 241.08 L 1296.00 243.17 L 1305.60 244.79 L 1315.20 245.90 L 1324.80 246.50 L 1334.40 246.56 L 1344.00 246.10 L 1353.60 245.12 L 1363.20 243.63 L 1372.80 241.65 L 1382.40 239.23 L 1392.00 236.39 L 1401.60 233.18 L 1411.20 229.65 L 1420.80 225.87 L 1430.40 221.87 L 1440.00 217.74 L 1440 300 Z" fill="#ec4899" fill-opacity="0.70"></path> <path d="M 0 300 L 0.00 229.70 L 9.60 229.74 L 19.20 229.14 L 28.80 227.90 L 38.40 226.05 L 48.00 223.62 L 57.60 220.64 L 67.20 217.17 L 76.80 213.24 L 86.40 208.94 L 96.00 204.32 L 105.60 199.46 L 115.20 194.44 L 124.80 189.32 L 134.40 184.21 L 144.00 179.17 L 153.60 174.28 L 163.20 169.63 L 172.80 165.28 L 182.40 161.31 L 192.00 157.77 L 201.60 154.73 L 211.20 152.22 L 220.80 150.30 L 230.40 148.98 L 240.00 148.30 L 249.60 148.26 L 259.20 148.86 L 268.80 150.10 L 278.40 151.95 L 288.00 154.38 L 297.60 157.36 L 307.20 160.83 L 316.80 164.76 L 326.40 169.06 L 336.00 173.68 L 345.60 178.54 L 355.20 183.56 L 364.80 188.68 L 374.40 193.79 L 384.00 198.83 L 393.60 203.72 L 403.20 208.37 L 412.80 212.72 L 422.40 216.69 L 432.00 220.23 L 441.60 223.27 L 451.20 225.78 L 460.80 227.70 L 470.40 229.02 L 480.00 229.70 L 489.60 229.74 L 499.20 229.14 L 508.80 227.90 L 518.40 226.05 L 528.00 223.62 L 537.60 220.64 L 547.20 217.17 L 556.80 213.24 L 566.40 208.94 L 576.00 204.32 L 585.60 199.46 L 595.20 194.44 L 604.80 189.32 L 614.40 184.21 L 624.00 179.17 L 633.60 174.28 L 643.20 169.63 L 652.80 165.28 L 662.40 161.31 L 672.00 157.77 L 681.60 154.73 L 691.20 152.22 L 700.80 150.30 L 710.40 148.98 L 720.00 148.30 L 729.60 148.26 L 739.20 148.86 L 748.80 150.10 L 758.40 151.95 L 768.00 154.38 L 777.60 157.36 L 787.20 160.83 L 796.80 164.76 L 806.40 169.06 L 816.00 173.68 L 825.60 178.54 L 835.20 183.56 L 844.80 188.68 L 854.40 193.79 L 864.00 198.83 L 873.60 203.72 L 883.20 208.37 L 892.80 212.72 L 902.40 216.69 L 912.00 220.23 L 921.60 223.27 L 931.20 225.78 L 940.80 227.70 L 950.40 229.02 L 960.00 229.70 L 969.60 229.74 L 979.20 229.14 L 988.80 227.90 L 998.40 226.05 L 1008.00 223.62 L 1017.60 220.64 L 1027.20 217.17 L 1036.80 213.24 L 1046.40 208.94 L 1056.00 204.32 L 1065.60 199.46 L 1075.20 194.44 L 1084.80 189.32 L 1094.40 184.21 L 1104.00 179.17 L 1113.60 174.28 L 1123.20 169.63 L 1132.80 165.28 L 1142.40 161.31 L 1152.00 157.77 L 1161.60 154.73 L 1171.20 152.22 L 1180.80 150.30 L 1190.40 148.98 L 1200.00 148.30 L 1209.60 148.26 L 1219.20 148.86 L 1228.80 150.10 L 1238.40 151.95 L 1248.00 154.38 L 1257.60 157.36 L 1267.20 160.83 L 1276.80 164.76 L 1286.40 169.06 L 1296.00 173.68 L 1305.60 178.54 L 1315.20 183.56 L 1324.80 188.68 L 1334.40 193.79 L 1344.00 198.83 L 1353.60 203.72 L 1363.20 208.37 L 1372.80 212.72 L 1382.40 216.69 L 1392.00 220.23 L 1401.60 223.27 L 1411.20 225.78 L 1420.80 227.70 L 1430.40 229.02 L 1440.00 229.70 L 1440 300 Z" fill="#a855f7" fill-opacity="0.50"></path> <path d="M 0 300 L 0.00 165.00 L 9.60 171.02 L 19.20 176.94 L 28.80 182.67 L 38.40 188.12 L 48.00 193.21 L 57.60 197.86 L 67.20 201.98 L 76.80 205.53 L 86.40 208.43 L 96.00 210.65 L 105.60 212.15 L 115.20 212.91 L 124.80 212.91 L 134.40 212.15 L 144.00 210.65 L 153.60 208.43 L 163.20 205.53 L 172.80 201.98 L 182.40 197.86 L 192.00 193.21 L 201.60 188.12 L 211.20 182.67 L 220.80 176.94 L 230.40 171.02 L 240.00 165.00 L 249.60 158.98 L 259.20 153.06 L 268.80 147.33 L 278.40 141.88 L 288.00 136.79 L 297.60 132.14 L 307.20 128.02 L 316.80 124.47 L 326.40 121.57 L 336.00 119.35 L 345.60 117.85 L 355.20 117.09 L 364.80 117.09 L 374.40 117.85 L 384.00 119.35 L 393.60 121.57 L 403.20 124.47 L 412.80 128.02 L 422.40 132.14 L 432.00 136.79 L 441.60 141.88 L 451.20 147.33 L 460.80 153.06 L 470.40 158.98 L 480.00 165.00 L 489.60 171.02 L 499.20 176.94 L 508.80 182.67 L 518.40 188.12 L 528.00 193.21 L 537.60 197.86 L 547.20 201.98 L 556.80 205.53 L 566.40 208.43 L 576.00 210.65 L 585.60 212.15 L 595.20 212.91 L 604.80 212.91 L 614.40 212.15 L 624.00 210.65 L 633.60 208.43 L 643.20 205.53 L 652.80 201.98 L 662.40 197.86 L 672.00 193.21 L 681.60 188.12 L 691.20 182.67 L 700.80 176.94 L 710.40 171.02 L 720.00 165.00 L 729.60 158.98 L 739.20 153.06 L 748.80 147.33 L 758.40 141.88 L 768.00 136.79 L 777.60 132.14 L 787.20 128.02 L 796.80 124.47 L 806.40 121.57 L 816.00 119.35 L 825.60 117.85 L 835.20 117.09 L 844.80 117.09 L 854.40 117.85 L 864.00 119.35 L 873.60 121.57 L 883.20 124.47 L 892.80 128.02 L 902.40 132.14 L 912.00 136.79 L 921.60 141.88 L 931.20 147.33 L 940.80 153.06 L 950.40 158.98 L 960.00 165.00 L 969.60 171.02 L 979.20 176.94 L 988.80 182.67 L 998.40 188.12 L 1008.00 193.21 L 1017.60 197.86 L 1027.20 201.98 L 1036.80 205.53 L 1046.40 208.43 L 1056.00 210.65 L 1065.60 212.15 L 1075.20 212.91 L 1084.80 212.91 L 1094.40 212.15 L 1104.00 210.65 L 1113.60 208.43 L 1123.20 205.53 L 1132.80 201.98 L 1142.40 197.86 L 1152.00 193.21 L 1161.60 188.12 L 1171.20 182.67 L 1180.80 176.94 L 1190.40 171.02 L 1200.00 165.00 L 1209.60 158.98 L 1219.20 153.06 L 1228.80 147.33 L 1238.40 141.88 L 1248.00 136.79 L 1257.60 132.14 L 1267.20 128.02 L 1276.80 124.47 L 1286.40 121.57 L 1296.00 119.35 L 1305.60 117.85 L 1315.20 117.09 L 1324.80 117.09 L 1334.40 117.85 L 1344.00 119.35 L 1353.60 121.57 L 1363.20 124.47 L 1372.80 128.02 L 1382.40 132.14 L 1392.00 136.79 L 1401.60 141.88 L 1411.20 147.33 L 1420.80 153.06 L 1430.40 158.98 L 1440.00 165.00 L 1440 300 Z" fill="#6366f1" fill-opacity="0.30"></path> </svg> filename: svg-waves-20260830-225348.svg

Rate this tool:

Related tools

Other tools you may find useful

SVG wave generator - section and background separators in one tool

SVG waves are a popular element of modern web design - they create a smooth transition between page sections, replacing a straight horizontal line. The tool generates a wave SVG path with control over shape, colors, height and number of layers.

wave generator SVG wave SVG section separator SVG wave generator wave background SVG

Types of waves and shapes

Sine wave: classic, smooth. Triangular wave (zigzag): sharp pattern. Step wave: pixel art effect. Asymmetric: different shapes of the left and right back. Multi-layered (layered waves): 2-3 layers of different colors with a phase shift - depth effect.

Configuration parameters

Amplitude: wave height (px). Frequency: number of cycles per container width. Phase shift: moves the wave horizontally. Flip: upside down wave. Smoothness: Bezier curves vs. acute angle. Area height: the space under the wave (filled with color).

Wave animation

CSS animation: @keyframes with transform: translateX(-100%) on a linear loop - the wave "flows". Two layers: faster wave (larger amplitude) + slower wave (smaller) = realistic ocean effect. SMIL animateTransform: an alternative to CSS. Performance: only transform/opacity animation uses GPU compositing (smooth 60fps).

HTML integration

Absolute position under section:

FAQ

How to make a responsive SVG wave?

Add preserveAspectRatio="none" and viewBox="0 0 1440 100". width="100%" height="auto". The wave extends to the width of the container. In CSS: position: absolute; bottom: 0; width: 100%; – wave under the section.

What color should I give the wave for a smooth transition?

Wave color = background color of the next section. Example: header section has background #4A90D9 (blue), next content section has white background → wave generated with fill="#FFFFFF" on blue background. Effect: natural transition.

Does SVG wave affect SEO and accessibility?

SVG decorative: add aria-hidden="true" - screen readers ignore them. role="img" only when the wave carries information (rare). SEO: content in sections under the wave is indexed normally - the wave does not block content.

How to add a gradient to an SVG wave?

Inside

How do SVG waves look on mobile devices?

With viewBox and width="100%": the wave automatically adjusts to the screen width. Amplitude may look too big or too small on a narrow screen - use media queries to change SVG height for mobile. Alternative: separate SVG for mobile with amplitude.

Related tools: SVG blob generator, SVG polygon generator and CSS gradient generator.