Teal family
Turquoise color
A light, soft teal leaning green. The reference turquoise is #40E0D0, as defined by the CSS named color.
| HEX | #40E0D0 | |
|---|---|---|
| RGB | rgb(64, 224, 208) | |
| HSL | hsl(174, 72%, 56%) | |
| HSV | hsv(174, 71%, 88%) | |
| OKLCH | oklch(82.2% 0.131 185.1) | |
| CMYK* | 71, 0, 7, 12 |
* CMYK is a simple conversion without a print profile; ask your printer for exact values.
What color is turquoise?
Turquoise is a light greenish blue named after the gemstone; the word comes from the French for Turkish, because the stone reached Europe through Turkey. The CSS turquoise, #40E0D0, is bright and slightly green, while the survey turquoise is deeper.
Turquoise hex codes by source
Color names are not standardized, so the same name can point to different colors. Here is every definition of turquoise in our three sources, with how close each one is to the reference.
| Name | HEX | Source | Compared with the reference |
|---|---|---|---|
| Turquoise | #40E0D0 | CSS named color | Reference shown on this page |
| Turquoise | #06C2AC | xkcd Color Survey | Noticeably different · 63% similar |
| Turquoise | #06C2AC | Color Names (meodai) | Noticeably different · 63% similar |
Turquoise vs Teal
#40E0D0
#008080
Teal is darker and duller; turquoise is the light, bright version. In numbers: the two are 0% similar (OKLab distance 0.282). See Teal for its own codes.
Colors similar to turquoise
The closest named colors to #40E0D0 across all three sources, with their similarity in OKLab.
Tints and shades of turquoise
The same hue from light to dark, generated in OKLab so the steps look even. Click a step to copy its HEX code.
Colors that go with turquoise
Classic color-wheel combinations built on #40E0D0, computed in OKLCH so the partners keep the same lightness and intensity. Each swatch shows the nearest common name.
Complementary
Analogous
Triadic
Split complementary
Turquoise with white and black text
WCAG asks for a contrast of at least 4.5:1 for body text (AA) and 3:1 for large text. On a turquoise background, black text is the better choice.
Use turquoise in CSS
.turquoise {
color: #40E0D0;
/* or */ color: rgb(64 224 208);
/* or */ color: hsl(174 72% 56%);
/* or */ color: oklch(82.2% 0.131 185.1);
/* CSS keyword */ color: turquoise;
}