Midnight
An exceptionally dark and moody blue
Midnight is an incredibly deep, almost black shade with distinct blue-purple undertones. Because it is so unsaturated and dark, it functions best as a dominant background color in high-end, moody interfaces. The hex code for Midnight is #03012d. While it lacks the harshness of pure black, pair it with crisp white text to maintain the necessary contrast for readability in your designs.
About Midnight
Blue drained down to its last spark
What does midnight mean?
People often read it as night, weight, and formality, and it commonly stands in for depth or the unknown. Its near-black lightness and low saturation make it feel heavy, still, and closed in, with only a faint blue trace.
Where you see midnight
- unlit tv screen
- deep-sea water
- cast-iron skillet
- moonless ocean horizon
- indigo dye washed to nothing
- asphalt at night
What it works for
Use it as a background or base layer when you want depth beyond plain black without losing the blue cast.
What colors go with midnight?
Saffron #f4c430The sharp warm yellow cuts through the dark and keeps the pair from reading as plain black.Dusty Rose #b56f76A muted pink softens the somber base without adding a brightness that would clash with it.Celadon #ace1afThe pale green-gray stays hushed against the deep base and adds a cool, misty lift.Brass #b5a642Warm metallic brass reads as lamplight against the dark and gives the pair a worn evening feel.
Questions about Midnight
What is the hex code for Midnight?
Midnight is #03012d. In RGB that is rgb(3, 1, 45), in HSL hsl(243, 96%, 9%) and in CMYK 93%, 98%, 0%, 82%.
How should I use Midnight #03012d in web design?
Midnight #03012d works effectively as a full-page background in high-end, moody interfaces. Since it functions as a near-black, pair it with crisp, high-contrast white text to ensure readability and maintain a clean, modern aesthetic for users.
Does #03012d work better as a primary or secondary color?
This shade serves best as a dominant foundation color rather than an accent. Its heavy saturation makes it ideal for grounding a design, leaving brighter colors or white text to provide necessary visual pop and hierarchy.
Is Midnight readable on white or black?
Midnight has a 20.07:1 contrast ratio on white and 1.04:1 on black. WCAG asks for 4.5:1 for body text and 3:1 for large text, so on white it works for body text and on black it is too faint for text. Try other pairs in the contrast checker.