Vibrant Vine
#4b373a
Richer gray with muted vine undertone for depth
About Vibrant Vine
On my screen, Vibrant Vine reads like a deep, smoky gray that tilts just far enough into a brown-leaning warmth to feel intentional, not accidental. It's darker than the softer charcoals you'd use for airy panels, but it doesn't drift purple like Black Magic in the shadows. Compared to Black Truffle, it's less "almost-black decision" and more restrained depth, with a steadier gray core and a warmer undertone that shows up most in long gradients.
I drop it into dark mode layouts for product consoles where the background has to disappear but still anchor structure, like SaaS admin dashboards, ticketing systems, and finance reporting views. For media interfaces, it holds up behind video players and editorial timelines without the slight "paused" dustiness that Dead Pixel can bring. It also plays well with saturated greens and steel blues when you need accents to pop without turning the whole interface cool and clinical.
One quirk: on large flat fields, it can make thin borders feel a touch heavier, so I'll often rely on lighter edge stops for hierarchy rather than pushing contrast.
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.