Tranquili Teal
#6c9da9
Cooler, deeper teal for grounded data sections
About Tranquili Teal
Tranquili Teal looks like the first cool shade you notice in a fogged window at midday: soft, not heavy, and not gray enough to feel purely corporate. Compared with Seaside, it holds onto more color depth, so it reads present rather than sea-glass clean. Versus Atlas Cedar, it doesn't carry that buried warmth, so the mood stays steadier and more blue-leaning. And unlike Cavolo Nero, it avoids that anchored depth, staying mid-light instead of weighty.
I use it for dashboards and finance apps when the UI needs calm continuity across panels and components, especially in light-mode surfaces like card backgrounds, table chrome, and section headers. It also works well for chart scaffolding and annotation pills where you want the data to lead but the interface still feels coordinated. Think the one you reach for when you're trying to match tones across states without drifting into the more muted, greener pull of Atlas Cedar.
Pair it with crisp blues and neutral charcoals; if your grays are already blue-tinted, this one can start to look samey fast.
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.