Prairie
#0b9d6a
Softer meadow green with warm prairie clarity
About Prairie
On a light canvas, Prairie looks like a field-green that's been softened by daylight, not dipped darker or pushed toward mint. It's warmer than Bejewelled, with less of that cool, enclosed depth, and it doesn't feel as airy as Bulma Hair. Compared to Eucalyptus, Prairie holds more green body and less yellow-leaning bite, so it reads steadier when your UI gets dense.
I use Prairie for product interfaces where you want "healthy and active" without tipping into timid. Think health and wellness apps, habit trackers, onboarding progress, and status chips that sit confidently next to neutral grays and sandy backgrounds. It also works well for design systems when you need the same success/active color across buttons, links, and charts, because it stays consistent instead of drifting.
Pair it with one warm neighbor if you can. All-cool palettes can make Prairie feel flatter than intended, especially against deep charcoals.
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.