Overgrowth
#88cc33
Balanced yellow-green for legible status blocks
About Overgrowth
Overgrowth is the green I notice on growing graphs and campus wayfinding signs that need to read "alive" without tipping into limey chaos. It's lighter than Jewel Beetle but keeps more body, with a fresher, leaf-leaning undertone and less of that controlled, beetle-shell coolness. Compared to Bergamot, it doesn't carry as much bright, energetic push, and it avoids Fairy Tale Green's softer, almost airy gentleness.
The mood here is steady momentum. It works great in dashboards and field operations summaries where you want status to feel confident, not neon or chalky. I also like it for growth labels in logistics and supply-chain UIs, plus product cards where "in progress" needs to sit clearly on busy grids. Pair it with off-whites and warm grays for clean contrast; skip very warm yellows, since they can nudge the undertone toward muddy.
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.
