#706B60#706B60
#706B60 is a mid, near-neutral grey. Relative luminance 0.148; OKLCH L 52.9% C 0.018 H 86.5°. Best body text is #FFFFFF at 5.30:1 contrast (WCAG AA passes).
Color values
| HEX | #706B60 |
|---|---|
| RGB | rgb(112, 107, 96) |
| HSL | hsl(41, 8%, 41%) |
| HSV | hsv(41, 14%, 44%) |
| CMYK | cmyk(0%, 4.5%, 14.3%, 56.1%) |
| CIE-LAB | lab(45.37, -0.13, 6.86) |
| CIE-LCH | lch(45.37, 6.87, 91.08°) |
| OKLab | oklab(52.9% 0.0011 0.0179) |
| OKLCH | oklch(52.9% 0.018 86.5) |
| XYZ | xyz(14.0509, 14.8048, 13.1815) |
| Luminance | 0.1480 (WCAG relative) |
| Temperature | neutral |
| Family | grey |
Closest named colors
Dimgray
#696969
ΔE00 6.02
Greyish Brown
#7A6A4F
ΔE00 7.27
Grey Brown
#7F7053
ΔE00 7.85
Brownish Grey
#86775F
ΔE00 8.12
Taupe
#8B7D6B
ΔE00 9.05
Medium Grey
#7D7F7C
ΔE00 9.09
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#706B60 #606570
analogous
#706360 #706B60 #6D7060
triadic
#706B60 #60706B #6B6070
tetradic
#706B60 #607063 #606570 #70606D
square
#706B60 #607063 #606570 #70606D
split-complementary
#706B60 #606D70 #636070
monochromatic
#2E2C28 #4F4C44 #706B60 #908A7D #ACA89E
Accessibility & contrast
On white
5.30
#706B60 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.96
#706B60 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #706B60
5.30:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##706B60 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##706B60 | 1.00 | 5.30 | 3.96 | 5.30 |
| #FFFFFF | 5.30 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.96 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.30 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#6E6B5F
Deuteranopia (green-blind)
#6F6C60
Tritanopia (blue-blind)
#736968
Achromatopsia (no color)
#6B6B6B
Design tokens & code
CSS
--color: #706b60; /* rgb */ color: rgb(112, 107, 96); /* oklch */ color: oklch(52.9% 0.018 86.5);
Tailwind
colors: {
custom: {
50: '#99958d',
500: '#706b60',
950: '#000000',
},
}SCSS
$custom: #706b60; $custom-light: #99958d; $custom-dark: #000000;
JSON
{
"hex": "#706b60",
"rgb": {
"r": 112,
"g": 107,
"b": 96
},
"hsl": {
"h": 41.25,
"s": 7.692,
"l": 40.784
},
"oklch": {
"l": 0.52899,
"c": 0.0179,
"h": 86.5
},
"luminance": 0.14805
}Semantic roles & 50–950 ramp
primary
#706B60
secondary
#90949C
accent
#89B177
background
#F9F9F8
surface
#F2F1F0
border
#CCCBCB
text
#0D0D0C
muted
#7E7E7D