Lavender Aurora SVG background, gradient

Lavender Aurora SVG background, gradient

A soft violet haze drifts over pale periwinkle, with an open centre for titles or logos. Place it behind a wellness website banner or a conference slide.

Similar SVGs

More from Aurora Gradient Backgrounds

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/DW2qPeBVzbm7/amnt.svg" alt="Lavender Aurora" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 576" width="1024" height="576"><g id="layer-1" data-name="Group 1"><g><defs><clipPath id="k0_0"><path d="M0 0H1024V576H0Z"/></clipPath><linearGradient id="k0_1" x1="0" y1="0" x2="1024" y2="576" gradientUnits="userSpaceOnUse"><stop stop-color="#c3c6ef"/><stop offset=".46" stop-color="#e4e3f7"/><stop offset="1" stop-color="#c9cef2"/></linearGradient><filter id="k0_2" x="-35%" y="-45%" width="170%" height="190%" color-interpolation-filters="sRGB"><feGaussianBlur stdDeviation="28"/></filter><linearGradient id="k0_3" x1="138" y1="-61" x2="352" y2="370" gradientUnits="userSpaceOnUse"><stop stop-color="#a19adb" stop-opacity=".18"/><stop offset=".4" stop-color="#a395d8" stop-opacity=".58"/><stop offset=".72" stop-color="#c1aceb" stop-opacity=".53"/><stop offset="1" stop-color="#e8def9" stop-opacity="0"/></linearGradient><linearGradient id="k0_4" x1="113" y1="42" x2="237" y2="292" gradientUnits="userSpaceOnUse"><stop stop-color="#f9edff" stop-opacity=".06"/><stop offset=".48" stop-color="#f5eaff" stop-opacity=".83"/><stop offset="1" stop-color="#e4d7f8" stop-opacity="0"/></linearGradient><filter id="k0_5" x="-15%" y="-25%" width="130%" height="150%" color-interpolation-filters="sRGB"><feGaussianBlur stdDeviation="7"/></filter><linearGradient id="k0_6" x1="916" y1="175" x2="747" y2="582" gradientUnits="userSpaceOnUse"><stop stop-color="#b0a4e6" stop-opacity="0"/><stop offset=".36" stop-color="#b9a9e8" stop-opacity=".47"/><stop offset=".72" stop-color="#a798db" stop-opacity=".59"/><stop offset="1" stop-color="#bdbeed" stop-opacity=".24"/></linearGradient><linearGradient id="k0_7" x1="861" y1="295" x2="911" y2="523" gradientUnits="userSpaceOnUse"><stop stop-color="#f8efff" stop-opacity="0"/><stop offset=".53" stop-color="#f6eaff" stop-opacity=".77"/><stop offset="1" stop-color="#e3dafa" stop-opacity=".04"/></linearGradient><radialGradient id="k0_8" cx=".5" cy=".48" r=".63"><stop stop-color="#f0ecfb" stop-opacity=".95"/><stop offset=".49" stop-color="#edeafa" stop-opacity=".7"/><stop offset="1" stop-color="#e5e4f9" stop-opacity="0"/></radialGradient></defs><g clip-path="url(#k0_0)"><path fill="url(#k0_1)" d="M0 0H1024V576H0Z"/><path d="M-92 136C101 327 381 188 415-85" fill="none" stroke="#a595d9" stroke-width="115" opacity=".25" filter="url(#k0_2)"/><path d="M731 649C622 403 1029 487 1104 247" fill="none" stroke="#a899de" stroke-width="123" opacity=".24" filter="url(#k0_2)"/><path d="M-80-57H507C456 22 406 95 331 156C207 256 72 256-80 147Z" fill="url(#k0_3)"/><path d="M-72 51C74 209 216 232 339 120C402 64 432-5 455-65H529C491 53 416 139 321 196C178 281 43 217-72 121Z" fill="url(#k0_4)" filter="url(#k0_5)"/><path d="M-56 96C70 244 207 252 330 161C414 99 458 22 484-44C457 42 417 114 338 176C220 269 68 276-56 139Z" fill="url(#k0_4)" opacity=".65"/><path d="M1065 130C997 216 886 236 828 302C765 374 817 423 900 459C969 490 1008 537 1035 614H672C591 499 666 421 777 360C888 299 1018 283 1065 130Z" fill="url(#k0_6)" filter="url(#k0_5)"/><path d="M1061 248C1008 341 877 367 787 416C703 462 717 523 806 618H905C816 533 773 486 829 439C897 382 1024 359 1061 248Z" fill="url(#k0_7)" filter="url(#k0_5)"/><path d="M1069 274C1009 364 881 390 811 442C769 474 785 514 819 551C768 511 743 469 792 430C864 373 1005 352 1069 274Z" fill="url(#k0_7)" opacity=".57"/><path fill="url(#k0_8)" d="M0 0H1024V576H0Z"/></g></g></g></svg>
CSS background-image
.lavender-aurora {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/DW2qPeBVzbm7/amnt.svg");
  background-size: contain;
}
React
import LavenderAuroraSvg from "./lavender-aurora.jsx"; // from the React tab above

<LavenderAuroraSvg width={48} height={48} />

Tags

Made with AMNT

AMNT SVG Pro 1.1 drew this from the words Lavender aurora background — soft violet haze over pale periwinkle; quiet centre. Premium abstract aurora website background. Broad luminous flowing ribbons and layered smooth colour gradients with elegant depth. Restrained composition, generous quiet space for a headline, full bleed opaque colour to all edges. No objects, stars, text, frames, logos or mockups. Crisp scalable vector shapes, smooth transitions, refined visual balance. Each design must follow its named palette and composition. as part of the pack Aurora Gradient Backgrounds. Want one like it? Make your own in the SVG studio.

Licence: free. A Free account may use it for personal work; Pro and Max download it with a commercial licence, fixed at download, forever. No credit needed. Read the licence

Settings