UI Shades

A study in teal

Turquoise

#40E0D0

Family
Teal
L
0.822
C
0.131
H
185°

Notes

Turquoise is the bright, slightly cyan-leaning teal of the gemstone seen at peak quality. The CSS hex sits between Light Sea Green and Dark Turquoise, with strong chroma at mid-high lightness. Travel, beauty, and wellness brands use it as a primary identity colour. Against cream it warms; against warm coral it builds a complementary accent. Against white the body text contrast is borderline; headlines are the safest territory and dark text overlays the clean option for buttons. Body text contrast against white falls below AA at body sizes; the value works only at headline sizes.

#40e0d0
Turquoise
Turquoise
#40e0d0
oklch(0.822 0.131 185.09)
rgb(64 224 208)
hsl(174 72.1% 56.5%)
Share
#e5fffd
#d0fff8
#9df9ed
#40e0d0
#00d3c1
#00a496
#00887c
#007066
#00524a
#003832
#001f1b

See your palette on a real UI - coming soon

Preview these shades across buttons, cards, and components in a live interface.

Plate 02

Palette built around Turquoise

Cross-reference
Q&A

Frequently asked questions

What is Turquoise?

Turquoise is the bright, slightly cyan-leaning teal of the gemstone seen at peak quality. The CSS hex sits between Light Sea Green and Dark Turquoise, with strong chroma at mid-high lightness. Its hex code is #40E0D0.

What are the tints and shades of Turquoise?

uishades builds an 11-step OKLCH ramp for Turquoise (#40E0D0) - its lightest tints through its darkest shades - plus an 11-stop Tailwind scale (50–950), both keyed to the same 50–950 stops. Lightness steps stay evenly spaced and the hue stays stable, so the mid-tones don't go muddy.

What colors pair well with Turquoise?

Its complementary color is #FFA0B9. Triadic partners are #D9AFFF and #FFB263; analogous neighbours are #40DAFA and #79DE9F.

What are the OKLCH and RGB values of Turquoise?

Turquoise is #40E0D0 - OKLCH 0.822 0.131 185°, rgb(64 224 208), in the teal family.