Distant Landscape
#e1efdd
Pale gray-green haze for softer, drier backgrounds
About Distant Landscape
Distant Landscape is the gray-green that actually feels gray first. It sits warmer and more saturated than Frozen Civilization or Floaty Bubble, which means it has enough presence to hold a layout without pretending to be white. You'll notice the color right away, it's not a trick of the light.
Reach for it in light mode interfaces where you need a soft, approachable background but can't afford to disappear: product pages, reading apps, onboarding flows, wellness dashboards. It pairs cleanly with warm neutrals and muted earth tones in ways the cooler pale greens won't. Type reads sharp. Photography doesn't fight it. And it won't flatten other elements the way the paler options do when you're layering UI states.
The thing: because it's warmer than Frozen Civilization and more present than Floaty Bubble, it works harder in layouts that need breathing room without feeling empty. Stack it with warm grays and soft golds instead of cool blues, and it'll feel intentional rather than accidental.
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.
Similar colors
Create a gradient with Distant Landscape
Open the generator with this color pre-loaded.
Start creating