Polar Lights Gradient

Cyan and violet mesh blobs glowing over a deep midnight base.
Open in the gradient generator →

Color Stops

#00C9FF
#7209B7
Background · #0B1120

Polar Lights CSS Code

HEX Copy
background: #0B1120;
background: radial-gradient(at 81% 68%, #00C9FF, transparent 70%), radial-gradient(at 19% 32%, #7209B7, transparent 70%), #0B1120;
RGBA Copy
background: rgba(11, 17, 32, 1.0);
background: radial-gradient(at 81% 68%, rgba(0, 201, 255, 1.0), transparent 70%), radial-gradient(at 19% 32%, rgba(114, 9, 183, 1.0), transparent 70%), rgba(11, 17, 32, 1.0);
HSLA Copy
background: hsla(223, 49%, 8%, 1.0);
background: radial-gradient(at 81% 68%, hsla(193, 100%, 50%, 1.0), transparent 70%), radial-gradient(at 19% 32%, hsla(276, 91%, 38%, 1.0), transparent 70%), hsla(223, 49%, 8%, 1.0);

More Gradient Presets

FAQ

What is the Polar Lights gradient?

Cyan and violet mesh blobs glowing over a deep midnight base.

What's the CSS code for the Polar Lights gradient?

Use background: radial-gradient(at 81% 68%, #00C9FF, transparent 70%), radial-gradient(at 19% 32%, #7209B7, transparent 70%), #0B1120;. RGBA and HSLA versions are also available on this page.

Generate a Gradient

Start your own gradient →