#17886A#17886A
#17886A is a mid, moderate teal. Relative luminance 0.188; OKLCH L 56.0% C 0.106 H 169.3°. Best body text is #000000 at 4.77:1 contrast (WCAG AA passes).
Color values
| HEX | #17886A |
|---|---|
| RGB | rgb(23, 136, 106) |
| HSL | hsl(164, 71%, 31%) |
| HSV | hsv(164, 83%, 53%) |
| CMYK | cmyk(83.1%, 0%, 22.1%, 46.7%) |
| CIE-LAB | lab(50.49, -37.45, 7.69) |
| CIE-LCH | lch(50.49, 38.23, 168.40°) |
| OKLab | oklab(56% -0.1041 0.0196) |
| OKLCH | oklch(56% 0.106 169.3) |
| XYZ | xyz(11.7576, 18.8296, 16.6477) |
| Luminance | 0.1883 (WCAG relative) |
| Temperature | neutral |
| Family | teal |
Closest named colors
Dark Sea Green
#11875D
ΔE00 3.62
Viridian
#1E9167
ΔE00 4.45
Sea Green
#2E8B57
ΔE00 6.58
Ocean Green
#3D9973
ΔE00 6.87
Teal (survey)
#029386
ΔE00 7.61
Dusty Teal
#4C9085
ΔE00 8.86
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#17886A #881735
analogous
#178831 #17886A #176D88
triadic
#17886A #6A1788 #886A17
tetradic
#17886A #311788 #881735 #6D8817
square
#17886A #311788 #881735 #6D8817
split-complementary
#17886A #88176D #883117
monochromatic
#051F18 #0E5441 #17886A #20BC93 #3BDEB3
Accessibility & contrast
On white
4.41
#17886A on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
4.77
#17886A on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #17886A
4.77:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##17886A | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##17886A | 1.00 | 4.41 | 4.77 | 4.77 |
| #FFFFFF | 4.41 | 1.00 | 21.00 | 21.00 |
| #000000 | 4.77 | 21.00 | 1.00 | 1.00 |
| ##000000 | 4.77 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#847E68
Deuteranopia (green-blind)
#76746C
Tritanopia (blue-blind)
#008980
Achromatopsia (no color)
#787878
Design tokens & code
CSS
--color: #17886a; /* rgb */ color: rgb(23, 136, 106); /* oklch */ color: oklch(56.0% 0.106 169.3);
Tailwind
colors: {
custom: {
50: '#6aab94',
500: '#17886a',
950: '#000000',
},
}SCSS
$custom: #17886a; $custom-light: #6aab94; $custom-dark: #000000;
JSON
{
"hex": "#17886a",
"rgb": {
"r": 23,
"g": 136,
"b": 106
},
"hsl": {
"h": 164.071,
"s": 71.069,
"l": 31.176
},
"oklch": {
"l": 0.55995,
"c": 0.10593,
"h": 169.3
},
"luminance": 0.18831
}Semantic roles & 50–950 ramp
primary
#17886A
secondary
#BC3F60
accent
#3A6AEE
background
#F6FAF9
surface
#ECF4F1
border
#C7CECB
text
#08100D
muted
#7A7F7E