Thalassa

#53b1ba

Softer, more muted teal-blue for restful layouts

Save
Share

About Thalassa

Thalassa looks like a beach-side blue pulled slightly back from cyan. It's light but not airy, with a softer edge and a steadier tone than , so it reads more like sea glass than sky. Compared to , it's a touch more saturated and less grounded, and it keeps its identity instead of feeling almost neutral. It also sits cooler than , with less of that gentle warmth-in-the-underpaint.

I use Thalassa when I want the one you reach for when an interface needs clarity without the high-pitch feel of brighter teals. It works well in health platforms (table headers, status pills, quiet CTA backgrounds), plus productivity dashboards and logistics portals where charts and filters have to stay readable. On light UIs, it gives you a clean hover state and accent line that doesn't punch.

One quirk: on very warm displays it can creep toward a lighter aqua. If your grays run warm, test it against them so it doesn't start competing with the surface.

Gradient preview

See how this color looks in an animated mesh gradient.

Conversions

Click any value to copy.

Need this programmatically? Color API

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

Aa
2.51:1Fail

On Gray 100 #f5f5f5

Aa
2.30:1Fail

On Gray 900 #18181b

Aa
7.06:1AAA

On Black #000000

Aa
8.37:1AAA

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

Complementary
Analogous
Triadic
Split Complementary
Tetradic

Suggested palettes

Palettes built around this color.

4 colors
3 colors
4 colors
4 colors

Community palettes

Published palettes that include this color.

Similar colors

Create a gradient with Thalassa

Open the generator with this color pre-loaded.

Start creating