#117E77#117E77
#117E77 is a mid, moderate teal. Relative luminance 0.164; OKLCH L 53.6% C 0.090 H 187.8°. Best body text is #FFFFFF at 4.91:1 contrast (WCAG AA passes).
Color values
| HEX | #117E77 |
|---|---|
| RGB | rgb(17, 126, 119) |
| HSL | hsl(176, 76%, 28%) |
| HSV | hsv(176, 87%, 49%) |
| CMYK | cmyk(86.5%, 0%, 5.6%, 50.6%) |
| CIE-LAB | lab(47.46, -29.71, -4.33) |
| CIE-LCH | lch(47.46, 30.03, 188.30°) |
| OKLab | oklab(53.61% -0.0888 -0.0122) |
| OKLCH | oklch(53.61% 0.09 187.8) |
| XYZ | xyz(11.0202, 16.3714, 20.0284) |
| Luminance | 0.1637 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Bluegreen
#017A79
ΔE00 2.85
Teal
#008080
ΔE00 3.03
Dark Aquamarine
#017371
ΔE00 4.39
Greenish Blue
#0B8B87
ΔE00 4.98
Deep Turquoise
#017374
ΔE00 5.10
Dark Cyan
#0A888A
ΔE00 5.37
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#117E77 #7E1118
analogous
#117E40 #117E77 #114E7E
triadic
#117E77 #77117E #7E7711
tetradic
#117E77 #40117E #7E1118 #4E7E11
square
#117E77 #40117E #7E1118 #4E7E11
split-complementary
#117E77 #7E114E #7E4011
monochromatic
#041B19 #0A4844 #117E77 #18B4AA #27E2D6
Accessibility & contrast
On white
4.91
#117E77 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.27
#117E77 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #117E77
4.91:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##117E77 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##117E77 | 1.00 | 4.91 | 4.27 | 4.91 |
| #FFFFFF | 4.91 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.27 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.91 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#767777
Deuteranopia (green-blind)
#686C78
Tritanopia (blue-blind)
#00817C
Achromatopsia (no color)
#717171
Design tokens & code
CSS
--color: #117e77; /* rgb */ color: rgb(17, 126, 119); /* oklch */ color: oklch(53.6% 0.090 187.8);
Tailwind
colors: {
custom: {
50: '#68a49e',
500: '#117e77',
950: '#000000',
},
}SCSS
$custom: #117e77; $custom-light: #68a49e; $custom-dark: #000000;
JSON
{
"hex": "#117e77",
"rgb": {
"r": 17,
"g": 126,
"b": 119
},
"hsl": {
"h": 176.147,
"s": 76.224,
"l": 28.039
},
"oklch": {
"l": 0.53612,
"c": 0.08969,
"h": 187.8
},
"luminance": 0.16373
}Semantic roles & 50–950 ramp
primary
#117E77
secondary
#B4373F
accent
#3541F3
background
#F6FAF9
surface
#ECF4F2
border
#C7CECC
text
#070F0E
muted
#7A7F7E