Midnight

#03012d

Cooler than Oblivion, midnight-grade blue-purple shadow

Save
Share

About Midnight

Look at Midnight on a dark canvas and you'll feel the difference right away: it's a deep, near-black purple, but not the sealed-in darkness of , and not the steadier, more clearly readable night-purple of . Midnight leans farther into the blue side of purple, with a slightly lower saturation that reads more like a coated shadow than an inky block.

For UI, it's the background that stays quiet when you want the page to disappear behind the content, especially in video streaming and podcast player shells where the art needs to lead. I also use it for admin and media workflows, like law and legal-archive portals and dense settings screens, when you want less atmosphere than and a more deliberate, colder pull.

Pair it with lighter lavender or crisp off-whites so text doesn't sink. Borders matter, but Midnight still feels tighter and more muted than the other deep purples nearby.

Gradient preview

See how this color looks in an animated mesh gradient.

Conversions

Click any value to copy.

Need this programmatically? Color API

Code snippets

Copy this color into your project.

Contrast checker

WCAG 2.1 contrast ratios. AA requires 4.5:1 for normal text, 3:1 for large. AAA requires 7:1 / 4.5:1.

On White #ffffff

Aa
20.07:1AAA

On Gray 100 #f5f5f5

Aa
18.41:1AAA

On Gray 900 #18181b

Aa
1.13:1Fail

On Black #000000

Aa
1.05:1Fail

Variations

Shades

Darker variations, created by mixing toward black.

Tints

Lighter variations, created by mixing toward white.

Tones

Muted variations, created by reducing saturation.

Hues

Hue rotations around the color wheel.

Temperatures

Warm and cool shifts of this color.

Color harmonies

Complementary
Analogous
Triadic
Split Complementary
Tetradic

Suggested palettes

Palettes built around this color.

4 colors
3 colors
4 colors
4 colors

Community palettes

Published palettes that include this color.

Similar colors

Create a gradient with Midnight

Open the generator with this color pre-loaded.

Start creating