Midnight Ocean
#0f2d4d
Crisp mid-dark blue with ocean-cool depth
About Midnight Ocean
Look at Midnight Ocean on a dark UI theme and it doesn't feel like "just another deep blue." It reads fuller and more saturated than Blue Whale, with a slightly cooler, cleaner direction that avoids Neptune's Dream's richer, glassy push. Compared to Beyond the Stars, it doesn't sink into near-black discipline. It stays clearly blue, but tight.
I use it when I need the header bar or primary navigation to feel grounded without turning heavy, especially across dashboards and finance apps in fintech, trading portals, and logistics control rooms. It's also a good fit for security platforms where you want status chips and link states to look confident, not icy. In motion graphics for product tours, the color holds its identity over gradients better than the darker near-black blues.
Pair it with light text and crisp neutrals; if you stack too many similarly dark blues, it can start to blur into the background instead of acting like a clean anchor.
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
On Gray 100 #f5f5f5
On Gray 900 #18181b
On Black #000000
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
Suggested palettes
Palettes built around this color.
Community palettes
Published palettes that include this color.