#71D3BC#71D3BC
#71D3BC is a light, moderate teal. Relative luminance 0.537; OKLCH L 80.0% C 0.099 H 176.5°. Best body text is #000000 at 11.75:1 contrast (WCAG AA passes).
Color values
| HEX | #71D3BC |
|---|---|
| RGB | rgb(113, 211, 188) |
| HSL | hsl(166, 53%, 64%) |
| HSV | hsv(166, 46%, 83%) |
| CMYK | cmyk(46.4%, 0%, 10.9%, 17.3%) |
| CIE-LAB | lab(78.30, -34.37, 2.47) |
| CIE-LCH | lch(78.30, 34.46, 175.89°) |
| OKLab | oklab(80.04% -0.099 0.006) |
| OKLCH | oklch(80.04% 0.099 176.5) |
| XYZ | xyz(39.1776, 53.7269, 55.8730) |
| Luminance | 0.5373 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Seafoam Blue
#78D1B6
ΔE00 1.84
Pale Teal
#82CBB2
ΔE00 3.56
Mediumaquamarine
#66CDAA
ΔE00 4.15
Turquoise
#40E0D0
ΔE00 5.75
Light Teal
#90E4C1
ΔE00 6.06
Aquamarine (survey)
#04D8B2
ΔE00 6.47
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#71D3BC #D37188
analogous
#71D38B #71D3BC #71B9D3
triadic
#71D3BC #BC71D3 #D3BC71
tetradic
#71D3BC #8B71D3 #D37188 #B9D371
square
#71D3BC #8B71D3 #D37188 #B9D371
split-complementary
#71D3BC #D371B9 #D38B71
monochromatic
#309A81 #42C5A6 #71D3BC #A0E1D2 #CEF0E8
Accessibility & contrast
On white
1.79
#71D3BC on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
11.75
#71D3BC on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #71D3BC
11.75:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##71D3BC | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##71D3BC | 1.00 | 1.79 | 11.75 | 11.75 |
| #FFFFFF | 1.79 | 1.00 | 21.00 | 21.00 |
| #000000 | 11.75 | 21.00 | 1.00 | 1.00 |
| ##000000 | 11.75 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#CDC9BB
Deuteranopia (green-blind)
#BDBDBE
Tritanopia (blue-blind)
#49D5CC
Achromatopsia (no color)
#C2C2C2
Design tokens & code
CSS
--color: #71d3bc; /* rgb */ color: rgb(113, 211, 188); /* oklch */ color: oklch(80.0% 0.099 176.5);
Tailwind
colors: {
custom: {
50: '#a0e1d0',
500: '#71d3bc',
950: '#000000',
},
}SCSS
$custom: #71d3bc; $custom-light: #a0e1d0; $custom-dark: #000000;
JSON
{
"hex": "#71d3bc",
"rgb": {
"r": 113,
"g": 211,
"b": 188
},
"hsl": {
"h": 165.918,
"s": 52.688,
"l": 63.529
},
"oklch": {
"l": 0.80043,
"c": 0.09917,
"h": 176.5
},
"luminance": 0.5373
}Semantic roles & 50–950 ramp
primary
#71D3BC
secondary
#9F495D
accent
#254AC0
background
#FCFEFE
surface
#F6FCFB
border
#D0D5D4
text
#0F1514
muted
#808483