Citrus
#9fb70a
Warm yellow-green midtone for grounded UI accents
About Citrus
Citrus is what happens when you push yellow-green past the point of politeness without going full neon. It's got the warmth and lift of Celery, but sharper, less muted, more intentional. Compared to Bergamot's measured energy or Aromatic Herbs's competent restraint, this one's brighter and more direct. It doesn't whisper.
You'll land it on agriculture dashboards, fitness apps, and fintech interfaces where you need green to feel optimistic and moving. It reads as progress without the clinical edge that cooler greens carry. The saturation is high enough that it doesn't fade into background grays, but the yellow undertone keeps it from feeling aggressive the way pure lime can. It's the color that works when you need someone to notice the accent and actually feel encouraged by it.
Pair it with off-whites, warm stone, or pale wood and it settles naturally. Against deep neutrals it holds without strain. The catch: next to very warm oranges or saturated reds it can flatten slightly, so make sure there's enough value contrast to keep it reading as its own thing.
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.