Serious Cloud
#7d848b
Deeper neutral gray for clouded headers and borders
About Serious Cloud
Serious Cloud looks like a ceiling-light gray that's been left to settle. Not brushed-metal like Ironside, and not velvety fogged like Smoky Studio. It has a steadier, slightly heavier feel, with a calmer cool undertone that doesn't wander blue or feel dim.
I use it when the UI needs separation without the "drafty" neutrality you get from Sea Lion. Think enterprise UI shells behind dense navigation, settings pages, and admin tables where you're grouping fields, keeping row density readable, and still want the interface to feel composed. It also works well for operations and logistics dashboards, especially around filter panels and form bands where you want structure that stays quiet next to data-dense content.
Pair it with charcoal or deep slate text, and lean on neutral-warm accents for controls. If you drop it next to very cool steel grays, it can start to look muted rather than grounded, so watch your border temperatures.
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.