Twilight Bloom Gradient
Purple and rose mesh blobs glowing from their own rich violet base.
Customize this gradient → Opens it in the generator: change the type or direction, adjust the colors, then copy the CSS or download.
Color Stops
#9D4EDD
#FF758C
#5A189A
#C77DFF
Background
#5A189A
#5A189A
Twilight Bloom CSS Code
background: rgba(90, 24, 154, 1.0); background: radial-gradient(at 31% 73%, rgba(157, 78, 221, 1.0), transparent 70%), radial-gradient(at 27% 31%, rgba(255, 117, 140, 1.0), transparent 70%), radial-gradient(at 69% 27%, rgba(90, 24, 154, 1.0), transparent 70%), radial-gradient(at 73% 69%, rgba(199, 125, 255, 1.0), transparent 70%), rgba(90, 24, 154, 1.0);
background: hsla(270, 73%, 35%, 1.0); background: radial-gradient(at 31% 73%, hsla(273, 68%, 59%, 1.0), transparent 70%), radial-gradient(at 27% 31%, hsla(350, 100%, 73%, 1.0), transparent 70%), radial-gradient(at 69% 27%, hsla(270, 73%, 35%, 1.0), transparent 70%), radial-gradient(at 73% 69%, hsla(274, 100%, 75%, 1.0), transparent 70%), hsla(270, 73%, 35%, 1.0);
background: #5A189A; background: radial-gradient(at 31% 73%, #9D4EDD, transparent 70%), radial-gradient(at 27% 31%, #FF758C, transparent 70%), radial-gradient(at 69% 27%, #5A189A, transparent 70%), radial-gradient(at 73% 69%, #C77DFF, transparent 70%), #5A189A; background: radial-gradient(at 31% 73% in oklch, oklch(58.81% 0.2118 306.32), transparent 70%), radial-gradient(at 27% 31% in oklch, oklch(73.18% 0.1687 11.89), transparent 70%), radial-gradient(at 69% 27% in oklch, oklch(39.67% 0.1894 300.32), transparent 70%), radial-gradient(at 73% 69% in oklch, oklch(71.97% 0.193 308.6), transparent 70%), oklch(39.67% 0.1894 300.32);
The same gradient with its colors in OKLCH. Older browsers show the standard version. How OKLCH gradients work →
Similar Gradients
More Gradient Presets
FAQ
What is the Twilight Bloom gradient?
Purple and rose mesh blobs glowing from their own rich violet base.
What's the CSS code for the Twilight Bloom gradient?
Use background: radial-gradient(at 31% 73%, #9D4EDD, transparent 70%), radial-gradient(at 27% 31%, #FF758C, transparent 70%), radial-gradient(at 69% 27%, #5A189A, transparent 70%), radial-gradient(at 73% 69%, #C77DFF, transparent 70%), #5A189A;. RGBA and HSLA versions are also available on this page.