Bonsai
#787b54
Earthy, subdued olive with balanced contrast
About Bonsai
Bonsai reads like olive that actually knows what it wants to be. It's warmer and more saturated than Bay Leaf, which means it doesn't disappear into the background the way that color does. But it's also lighter than Capers, so it won't demand as much visual weight when you're trying to build hierarchy. There's real yellow in this one, enough that it feels intentional without tipping into brown.
Reach for it on product pages, editorial layouts, and craft-adjacent interfaces where you need something that sits between neutral and personality. It works on heritage brands, food and agriculture sites, even dashboard environments where you want the UI to feel considered instead of sterile. Pair it with warm blacks, cream type, and muted accents, and it stays balanced across scales. Unlike Antique's studied restraint or Capers' tonal range trick, this one holds steady, test it once and you know what you've got.
The quirk: it's green enough to feel botanical, warm enough to read almost like clay. That middle ground is the whole point. It won't feel cold or corporate, but it also won't make you think you're looking at actual vegetation.
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.