Northern Bloom Gradient
Teal and violet mesh blobs glowing over deep navy.
Open in the gradient generator →
Color Stops
#64FFDA
#7C4DFF
#18FFFF
Background · #0A1F2E
Northern Bloom CSS Code
HEX Copy
background: #0A1F2E; background: radial-gradient(at 67% 79%, #64FFDA, transparent 70%), radial-gradient(at 16% 50%, #7C4DFF, transparent 70%), radial-gradient(at 67% 21%, #18FFFF, transparent 70%), #0A1F2E;
RGBA Copy
background: rgba(10, 31, 46, 1.0); background: radial-gradient(at 67% 79%, rgba(100, 255, 218, 1.0), transparent 70%), radial-gradient(at 16% 50%, rgba(124, 77, 255, 1.0), transparent 70%), radial-gradient(at 67% 21%, rgba(24, 255, 255, 1.0), transparent 70%), rgba(10, 31, 46, 1.0);
HSLA Copy
background: hsla(205, 64%, 11%, 1.0); background: radial-gradient(at 67% 79%, hsla(166, 100%, 70%, 1.0), transparent 70%), radial-gradient(at 16% 50%, hsla(256, 100%, 65%, 1.0), transparent 70%), radial-gradient(at 67% 21%, hsla(180, 100%, 55%, 1.0), transparent 70%), hsla(205, 64%, 11%, 1.0);
More Gradient Presets
FAQ
What is the Northern Bloom gradient?Teal and violet mesh blobs glowing over deep navy.
What's the CSS code for the Northern Bloom gradient?
Use
background: radial-gradient(at 67% 79%, #64FFDA, transparent 70%), radial-gradient(at 16% 50%, #7C4DFF, transparent 70%), radial-gradient(at 67% 21%, #18FFFF, transparent 70%), #0A1F2E;. RGBA and HSLA versions are also available on this page.