Luna
#d4d8ce
Slightly cooler pale gray, calmer than Fog
About Luna
I keep Luna in the back pocket for UI backgrounds where I want "quiet" without drifting into Fog's almost-white nothingness. It reads as a light gray with a soft, lunar coolness that feels composed but not sterile. Compared to Feta, it has a slightly warmer breath and more body, so it doesn't feel quite as crisp. And unlike Gin, it never turns yellow, even when your content is rich.
I reach for Luna when building product interfaces, documentation sites, and content-heavy dashboards that need a calm field for charts, tables, and dense text. It sits nicely under dark typography and keeps diagrams from looking cloudy, which Fog can do when the layout is very busy. In CMS previews, it gives screenshots room to breathe without shifting skin tones or product photography toward green or beige.
One quirk: Luna can look a touch formal on very high-contrast icon sets. If that happens, bump the surrounding whites slightly so the gray feels intentional, not flat.
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.