Umbra
#211e1f
Softer neutral gray-brown, steadies panels without warmth
About Umbra
On my screen, Umbra looks like a dark gray that's already been put through a press: not quite black, but also not soft like charcoal. It carries a faint, earthy hush under the surface, so it feels less neutral than Ink Black and less void-dark than Bats Cloak. Where those read cleaner and colder, Umbra turns slightly toward grounded warmth without going brown.
I use it when the UI needs depth but I still want the background to feel "stopped," not weightless. Think dashboards and finance apps that show forms, process steps, and dense tables, plus internal admin consoles, HR systems, and logistics workflows where you need hierarchy to stay legible over long sessions. Compared to Smoky Charcoal, Umbra holds the tone with a touch more seriousness, so panels feel tighter and more grounded.
Pair it with cool light grays or near-whites that aren't creamy. If you drop warm highlights on top, Umbra can start to look a bit dusty instead of controlled, so keep the accent temperature in check.
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.