Menu

Beta
Sign in
Violet Aurora SVG background, gradient

Violet Aurora SVG background, gradient

Lilac and indigo bands of light flow across the canvas, keeping the centre uncluttered for a headline. Use it for a portfolio homepage or a digital event poster.

Free · from Aurora Gradient Backgrounds

Similar SVGs

More from Aurora Gradient Backgrounds

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/BJRUsqxE1kxI/amnt.svg" alt="Violet 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="#161333"/><stop offset=".48" stop-color="#0c1028"/><stop offset="1" stop-color="#191337"/></linearGradient><radialGradient id="k0_2" cx="0" cy="0" r="1" gradientTransform="translate(48 174) rotate(32) scale(397 340)" gradientUnits="userSpaceOnUse"><stop stop-color="#7560c7" stop-opacity=".42"/><stop offset="1" stop-color="#34255e" stop-opacity="0"/></radialGradient><radialGradient id="k0_3" cx="0" cy="0" r="1" gradientTransform="translate(1005 372) rotate(152) scale(363 410)" gradientUnits="userSpaceOnUse"><stop stop-color="#6451c6" stop-opacity=".4"/><stop offset="1" stop-color="#382562" stop-opacity="0"/></radialGradient><mask id="k0_4"><path fill="url(#k0_5)" d="M0 0H1024V576H0Z"/></mask><linearGradient id="k0_5" x1="0" y1="0" x2="0" y2="576" gradientUnits="userSpaceOnUse"><stop stop-color="#ffffff" stop-opacity=".75"/><stop offset=".35" stop-color="#ffffff"/><stop offset=".74" stop-color="#ffffff" stop-opacity=".8"/><stop offset="1" stop-color="#ffffff" stop-opacity=".12"/></linearGradient><linearGradient id="k0_6" x1="25" y1="198" x2="264" y2="243" gradientUnits="userSpaceOnUse"><stop stop-color="#4539a0" stop-opacity=".05"/><stop offset=".42" stop-color="#6955ba" stop-opacity=".36"/><stop offset=".78" stop-color="#ad91e6" stop-opacity=".78"/><stop offset=".94" stop-color="#dcc1ff" stop-opacity=".86"/><stop offset="1" stop-color="#9674d4" stop-opacity=".08"/></linearGradient><linearGradient id="k0_7" x1="36" y1="190" x2="185" y2="116" gradientUnits="userSpaceOnUse"><stop stop-color="#39358d" stop-opacity="0"/><stop offset=".63" stop-color="#8371d2" stop-opacity=".45"/><stop offset="1" stop-color="#c4a8f2" stop-opacity=".7"/></linearGradient><linearGradient id="k0_8" x1="779" y1="326" x2="1046" y2="376" gradientUnits="userSpaceOnUse"><stop stop-color="#6950b0" stop-opacity="0"/><stop offset=".2" stop-color="#d1b0fb" stop-opacity=".78"/><stop offset=".38" stop-color="#9c82e7" stop-opacity=".67"/><stop offset=".7" stop-color="#5455b7" stop-opacity=".44"/><stop offset="1" stop-color="#383e96" stop-opacity=".04"/></linearGradient><linearGradient id="k0_9" x1="871" y1="349" x2="996" y2="416" gradientUnits="userSpaceOnUse"><stop stop-color="#d3b5ff" stop-opacity=".55"/><stop offset=".37" stop-color="#8179d8" stop-opacity=".38"/><stop offset="1" stop-color="#403f95" stop-opacity="0"/></linearGradient><radialGradient id="k0_10" cx="0" cy="0" r="1" gradientTransform="translate(512 283) scale(374 329)" gradientUnits="userSpaceOnUse"><stop offset=".25" stop-color="#0c1028" stop-opacity=".95"/><stop offset=".64" stop-color="#0c1028" stop-opacity=".68"/><stop offset="1" stop-color="#0c1028" stop-opacity="0"/></radialGradient></defs><g clip-path="url(#k0_0)"><path fill="url(#k0_1)" d="M0 0H1024V576H0Z"/><path fill="url(#k0_2)" d="M0 0H1024V576H0Z"/><path fill="url(#k0_3)" d="M0 0H1024V576H0Z"/><g mask="url(#k0_4)"><path fill="url(#k0_6)" d="M-99-66H109C147 34 278 83 271 181C265 269 163 307 134 395C115 453 161 513 225 610H72C-8 509 16 437 65 358C121 268 183 223 172 159C161 97 17 56-99-66Z"/><path fill="url(#k0_7)" d="M-80-47H28C59 57 187 100 192 169C199 251 101 299 57 380C23 443 26 504 76 581H-20C-58 498-43 409 7 330C57 252 127 206 118 153C109 88 2 55-80-47Z"/><path fill="url(#k0_8)" d="M1027-70H1170C1098 72 1081 130 978 204C882 273 811 324 828 399C844 471 941 512 1079 601H922C818 520 748 461 759 379C772 286 882 233 948 163C1016 91 1039 22 1027-70Z"/><path fill="url(#k0_9)" d="M1128 83C1097 200 1008 247 928 303C853 355 855 410 923 460C968 493 1023 515 1081 547L1089 629C1001 560 927 537 871 482C800 413 813 350 887 292C978 222 1072 188 1128 83Z"/></g><path fill="url(#k0_10)" d="M0 0H1024V576H0Z"/></g></g></g></svg>
CSS background-image
.violet-aurora {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/BJRUsqxE1kxI/amnt.svg");
  background-size: contain;
}
React
import VioletAuroraSvg from "./violet-aurora.jsx"; // from the React tab above

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

Tags

auroravioletlilacindigobackground

Made with AMNT

AMNT SVG Pro 1.1 drew this from the words Violet aurora background — lilac and indigo flowing light; 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