Lava Stone
#3c4151
Warmer charcoal gray with lava undertones, grounded
About Lava Stone
On a dark panel, Lava Stone feels a bit more grounded than the other grays in this family. It has a lava-warm undertone that keeps it from reading too bluish like Midnight Serenade, and it's less chalky and film-leaning than Inkblot. Compared with Madonna, it pushes slightly deeper and more stony, so the surface doesn't look as flat or tightly "neutral" under harsh UI lighting.
I reach for this shade when the UI needs authority without turning heavy. It works especially well in newsroom CMS layouts for editorials, where metadata strips, side rails, and status states should look steady over mixed thumbnails. In audio and photo workflows, it's a strong backdrop for waveform panes and dense inspector controls, holding edges crisply while avoiding the thinner, cooler impression you can get with Midnight Serenade.
Pairing note: keep highlights modest. Too-icy accents can fight Lava Stone's warmth and make dividers feel less crisp than you intended.
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.
