Emerald Bliss
#4cbdac
Balanced teal-aqua for calmer, cooler blue panels
About Emerald Bliss
Emerald Bliss sits brighter and warmer than the deeper teals around it, it's got enough green in the mix that it actually feels alive without the clinical precision of Cockatoo or the murky weight of Ambrosial Oceanside. This is the color that doesn't demand all your attention but refuses to disappear either.
Use it for accent layers, hover states, and soft interactive moments in health apps, fintech interfaces, and design systems where you need something that reads as considered but not aggressive. It plays well in cards, badges, and secondary buttons where Celadon Porcelain would feel too washed out and Cockatoo would feel too confrontational. The warmth keeps it from drifting gray, and the lightness means it won't flatten even on cooler monitor profiles.
Pair it with dark charcoal type and it holds clean. Worth noting: it's sensitive enough to background temperature that a warm gray backdrop will shift how it lands, so test it early against your actual neutrals. It's the one you reach for when you want presence without pressure.
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.