Distant Cloud
#e5eae6
Soft, slightly warm neutral gray for grounded UI
About Distant Cloud
Distant Cloud is the gray that doesn't announce itself. It's warmer and more saturated than Clair de Lune, but pulls back from Bath Bubbles' almost-green presence. Place it next to those two and you'll see what I mean: it sits in that middle territory where the undertone exists but doesn't dominate. It's got enough density to feel like a choice, not like you accidentally left white unsaved.
Reach for it on light mode dashboards in fintech, healthcare, SaaS, the spaces where a pure white background feels too bright but a warmer gray reads as dated. Secondary panels, form backgrounds, disabled states, anywhere you need something that recedes without disappearing. It holds typography cleanly and won't wash out photography or colored elements the way the paler grays do.
The thing to know: it's more forgiving than Clair de Lune in dense layouts, but pair it carefully with cool blues and true greens. It works best when you're building on a darker or more saturated foundation, it's the kind of color that needs real contrast nearby to earn its place.
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.