Madras
#473e23
Deeper olive brown-green for grounded, low-gloss panels
About Madras
Madras is the kind of green you notice when you see it on a kraft-label run: it reads like earth-stained foliage, not the clean snap of a leaf. Compared to Avocado Stone, it has more presence and a truer green core instead of drifting toward stone-dull and muted. Versus Alligator Gladiator, it doesn't drop into heavy shadow. It stays lighter and more openly green, with a browner undertone that feels dusted rather than dark.
For real work, I use Madras in natural product packaging where you want grounded color without going full olive-brown. It's solid for editorial sidebars and brand systems for pantry and garden goods when the typography needs a steady frame. In UI, it's a good background for settings pages, filter panels, and dashboards and finance apps where you want a calm green that won't look like it's trying to be the brand's hero. It's the one you reach for when you need it to sit behind content, warmer than pure white, but still unmistakably green.
Pair it with creams or slightly cooler grays; with yellow-leaning beige it can feel a touch muddy, and with very dark browns it loses the green-first read that makes it useful.
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.