#87CFC2#87CFC2
#87CFC2 is a light, moderate teal. Relative luminance 0.537; OKLCH L 80.3% C 0.075 H 181.7°. Best body text is #000000 at 11.73:1 contrast (WCAG AA passes).
Color values
| HEX | #87CFC2 |
|---|---|
| RGB | rgb(135, 207, 194) |
| HSL | hsl(169, 43%, 67%) |
| HSV | hsv(169, 35%, 81%) |
| CMYK | cmyk(34.8%, 0%, 6.3%, 18.8%) |
| CIE-LAB | lab(78.27, -25.37, -0.68) |
| CIE-LCH | lch(78.27, 25.38, 181.53°) |
| OKLab | oklab(80.33% -0.0746 -0.0022) |
| OKLCH | oklch(80.33% 0.075 181.7) |
| XYZ | xyz(42.0386, 53.6690, 59.1725) |
| Luminance | 0.5367 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Pale Teal
#82CBB2
ΔE00 4.42
Seafoam Blue
#78D1B6
ΔE00 5.01
Mediumturquoise
#48D1CC
ΔE00 6.82
Mediumaquamarine
#66CDAA
ΔE00 7.79
Turquoise
#40E0D0
ΔE00 7.83
Light Teal
#90E4C1
ΔE00 8.20
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#87CFC2 #CF8794
analogous
#87CF9E #87CFC2 #87B8CF
triadic
#87CFC2 #C287CF #CFC287
tetradic
#87CFC2 #9E87CF #CF8794 #B8CF87
square
#87CFC2 #9E87CF #CF8794 #B8CF87
split-complementary
#87CFC2 #CF87B8 #CF9E87
monochromatic
#3F9D8C #5BBEAC #87CFC2 #B3E0D8 #DEF2EE
Accessibility & contrast
On white
1.79
#87CFC2 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
11.73
#87CFC2 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #87CFC2
11.73:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##87CFC2 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##87CFC2 | 1.00 | 1.79 | 11.73 | 11.73 |
| #FFFFFF | 1.79 | 1.00 | 21.00 | 21.00 |
| #000000 | 11.73 | 21.00 | 1.00 | 1.00 |
| ##000000 | 11.73 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C9C7C2
Deuteranopia (green-blind)
#BCBEC3
Tritanopia (blue-blind)
#6FD2CB
Achromatopsia (no color)
#C2C2C2
Design tokens & code
CSS
--color: #87cfc2; /* rgb */ color: rgb(135, 207, 194); /* oklch */ color: oklch(80.3% 0.075 181.7);
Tailwind
colors: {
custom: {
50: '#acded4',
500: '#87cfc2',
950: '#000000',
},
}SCSS
$custom: #87cfc2; $custom-light: #acded4; $custom-dark: #000000;
JSON
{
"hex": "#87cfc2",
"rgb": {
"r": 135,
"g": 207,
"b": 194
},
"hsl": {
"h": 169.167,
"s": 42.857,
"l": 67.059
},
"oklch": {
"l": 0.80328,
"c": 0.07467,
"h": 181.7
},
"luminance": 0.53672
}Semantic roles & 50–950 ramp
primary
#87CFC2
secondary
#A35865
accent
#3048B6
background
#FDFEFE
surface
#F7FCFB
border
#D0D5D4
text
#101514
muted
#818483