Misty Morning
#b2c8bd
Airy, slightly desaturated cool-gray for soft UI space
About Misty Morning
On a morning screenshot, Misty Morning reads like the gray that's been gently rinsed. It has the lightness of a high-key surface, but it doesn't go chalky. Compared to Metal, it's less "worked-on" and more quiet, more about softness than solidity. Compared to Infusion, it feels warmer and slightly dustier, not office-glass clean. And versus Murmur, it's airier and less plaster-like, so it won't hold as much weight along hard edges.
I use Misty Morning for places where the background needs to feel settled from the start: onboarding flows in consumer apps, form-heavy screens in logistics, and the pale panels around copy in wellness content sites. It's the one I reach for when dashboards and finance apps don't need extra contrast, just calm structure. Pair it with medium charcoals for labels and thin rule lines, and it stays coherent without stealing attention from photos.
One quirk: if you stack too many same-value layers, it can drift toward a milky look, so keep borders a touch deeper or let spacing do the hierarchy work.
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.