Lost in Space
#03386a
Midnight royal blue for high-contrast headers
About Lost in Space
Lost in Space feels like a night-sky blue that kept a little daylight in it. It's deeper than a UI cobalt, but not as near-black as Beyond the Stars, so it holds its identity instead of collapsing into the background. Compared with Aegean Blue and Mermaid Blues, it reads a touch less saturated and a bit more softened, so it doesn't shout.
I use it for dashboards and analytics surfaces where you want contrast that stays calm. It's also a strong pick for fintech product screens, pricing tables, and settings pages when you need links, active states, or key data highlights to look intentional without going heavy. Where Mermaid Blues stays crisp and slightly "underwater," Lost in Space sits smoother, with a more even, steady temperature.
Pair it with near-white typography and cool grays, and keep it away from very dark nav bars unless you give it enough separation. On tiny text, the softness can cost you a little punch.
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.
