Ivy
#277b74
Slightly muted ivy-teal for restful, soft-calm sections
About Ivy
Ivy reads like a grown-in teal on a sunny monitor: medium-deep, but not murky. Compared to Emperor Jade's heavy, almost-black authority and Green Sleeves's warmer blue-green lean, Ivy stays cooler and more focused, with less darkness and more clarity. It feels cool-headed and steady rather than weighty.
In day-to-day UI, that translates to crisp accents that don't clamor for attention. I've used it for primary buttons and key highlights in logistics and education platforms where the interface needs to look intentional on white layouts, plus selection states in admin dashboards and internal tools. Versus Jade Jewel, Ivy gives you a touch more depth and softness, so it won't feel quite as sharp against bright neutrals, but it still avoids the settling heaviness of Emperor Jade.
Pair it with clean grays and off-whites. If you drop it onto darker backgrounds, let the surrounding text lighten up, because Ivy's cooler undertone can look flatter when contrast gets tight.
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.