#877E73#877E73
#877E73 is a mid, near-neutral orange. Relative luminance 0.213; OKLCH L 59.8% C 0.020 H 72.9°. Best body text is #000000 at 5.26:1 contrast (WCAG AA passes).
Color values
| HEX | #877E73 |
|---|---|
| RGB | rgb(135, 126, 115) |
| HSL | hsl(33, 8%, 49%) |
| HSV | hsv(33, 15%, 53%) |
| CMYK | cmyk(0%, 6.7%, 14.8%, 47.1%) |
| CIE-LAB | lab(53.29, 1.43, 7.22) |
| CIE-LCH | lch(53.29, 7.36, 78.82°) |
| OKLab | oklab(59.79% 0.0058 0.0188) |
| OKLCH | oklch(59.79% 0.02 72.9) |
| XYZ | xyz(20.5468, 21.3108, 19.2473) |
| Luminance | 0.2131 (WCAG relative) |
| Temperature | neutral |
| Family | orange |
Closest named colors
Taupe
#8B7D6B
ΔE00 3.28
Brownish Grey
#86775F
ΔE00 5.95
Warm Grey
#978A84
ΔE00 6.20
Medium Grey
#7D7F7C
ΔE00 6.32
Gray
#808080
ΔE00 6.44
Brown Grey
#8D8468
ΔE00 7.31
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#877E73 #737C87
analogous
#877473 #877E73 #868773
triadic
#877E73 #73877E #7E7387
tetradic
#877E73 #738774 #737C87 #877386
square
#877E73 #738774 #737C87 #877386
split-complementary
#877E73 #738687 #747387
monochromatic
#45403B #665F57 #877E73 #A49C94 #C0BBB5
Accessibility & contrast
On white
3.99
#877E73 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.26
#877E73 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #877E73
5.26:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##877E73 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##877E73 | 1.00 | 3.99 | 5.26 | 5.26 |
| #FFFFFF | 3.99 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.26 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.26 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#827E72
Deuteranopia (green-blind)
#848073
Tritanopia (blue-blind)
#8B7C7B
Achromatopsia (no color)
#7F7F7F
Design tokens & code
CSS
--color: #877e73; /* rgb */ color: rgb(135, 126, 115); /* oklch */ color: oklch(59.8% 0.020 72.9);
Tailwind
colors: {
custom: {
50: '#aaa39b',
500: '#877e73',
950: '#000000',
},
}SCSS
$custom: #877e73; $custom-light: #aaa39b; $custom-dark: #000000;
JSON
{
"hex": "#877e73",
"rgb": {
"r": 135,
"g": 126,
"b": 115
},
"hsl": {
"h": 33,
"s": 8,
"l": 49.02
},
"oklch": {
"l": 0.59787,
"c": 0.01969,
"h": 72.9
},
"luminance": 0.2131
}Semantic roles & 50–950 ramp
primary
#877E73
secondary
#A6AAB0
accent
#91B177
background
#FAFAF9
surface
#F4F3F2
border
#CECDCC
text
#100F0E
muted
#7F7F7E