Skip to content
DesignHub

Studio

Background Studio

Procedural waves, blobs, mesh gradients, aurora, noise and patterns. Export SVG, PNG or CSS.

Generator

Controls

Press Space for a new seed.

50
1.00×
0°
1600 × 9002.2 KB
background-waves-1337.css
.background {
  background-color: #0e0e10;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1600' height='900' viewBox='0 0 1600 900' preserveAspectRatio='xMidYMid slice'%3E%3Crect width='100%25' height='100%25' fill='%230e0e10'/%3E%3Cg%3E%3Cpath d='M0 152.7C26.7 170.3 106.7 240.2 160 258.5C213.3 276.8 266.7 265.4 320 262.5C373.3 259.7 426.7 259.7 480 241.4C533.3 223.1 586.7 158.3 640 153C693.3 147.6 746.7 186.6 800 209.1C853.3 231.6 906.7 283.3 960 288C1013.3 292.7 1066.7 252.5 1120 237.1C1173.3 221.7 1226.7 208.5 1280 195.7C1333.3 183 1386.7 147.1 1440 160.7C1493.3 174.2 1573.3 257.9 1600 277.3L1600 900L0 900Z' fill='%236366f1' fill-opacity='0.75'/%3E%3Cpath d='M0 375.9C33.3 365.9 133.3 336.2 200 316.1C266.7 296 333.3 243.4 400 255.3C466.7 267.2 533.3 356.2 600 387.3C666.7 418.5 733.3 455.9 800 442.4C866.7 428.9 933.3 332.1 1000 306.4C1066.7 280.7 1133.3 287.3 1200 288C1266.7 288.7 1333.3 282.2 1400 310.5C1466.7 338.8 1566.7 433.2 1600 457.8L1600 900L0 900Z' fill='%23aa66e7' fill-opacity='0.79'/%3E%3Cpath d='M0 462.2C38.1 445.8 152.4 355.6 228.6 363.4C304.8 371.2 381 480.9 457.1 509C533.3 537 609.5 537.9 685.7 531.7C761.9 525.6 838.1 493.8 914.3 472.1C990.5 450.4 1066.7 408.2 1142.9 401.8C1219 395.4 1295.2 404.3 1371.4 433.6C1447.6 462.9 1561.9 553.7 1600 577.7L1600 900L0 900Z' fill='%23df6cc9' fill-opacity='0.83'/%3E%3Cpath d='M0 689.1C38.1 678.3 152.4 650.2 228.6 624.4C304.8 598.6 381 549.4 457.1 534.2C533.3 519 609.5 519.8 685.7 533.1C761.9 546.5 838.1 587.2 914.3 614.1C990.5 640.9 1066.7 703.7 1142.9 694.3C1219 684.9 1295.2 583.6 1371.4 557.7C1447.6 531.8 1561.9 542.2 1600 539.1L1600 900L0 900Z' fill='%23ff7897' fill-opacity='0.88'/%3E%3Cpath d='M0 804.5C33.3 794.3 133.3 772.4 200 743.7C266.7 715 333.3 639.4 400 632.1C466.7 624.8 533.3 680.1 600 699.9C666.7 719.7 733.3 736.8 800 751.2C866.7 765.5 933.3 802.3 1000 786.2C1066.7 770 1133.3 677.4 1200 654.3C1266.7 631.2 1333.3 626.8 1400 647.8C1466.7 668.9 1566.7 758.6 1600 780.7L1600 900L0 900Z' fill='%23ff995f' fill-opacity='0.92'/%3E%3Cpath d='M0 768.4C38.1 796 152.4 911.6 228.6 934.2C304.8 956.8 381 936.5 457.1 904C533.3 871.5 609.5 756.1 685.7 739.1C761.9 722.1 838.1 780.4 914.3 802.1C990.5 823.8 1066.7 846.2 1142.9 869.1C1219 892 1295.2 952.8 1371.4 939.3C1447.6 925.8 1561.9 813.3 1600 788.1L1600 900L0 900Z' fill='%23fbbf24' fill-opacity='0.96'/%3E%3C/g%3E%3C/svg%3E");
  background-size: cover;
  background-position: center;
}