#707A6A#707A6A
#707A6A is a mid, muted grey. Relative luminance 0.184; OKLCH L 56.6% C 0.027 H 133.6°. Best body text is #000000 at 4.68:1 contrast (WCAG AA passes).
Color values
| HEX | #707A6A |
|---|---|
| RGB | rgb(112, 122, 106) |
| HSL | hsl(98, 7%, 45%) |
| HSV | hsv(98, 13%, 48%) |
| CMYK | cmyk(8.2%, 0%, 13.1%, 52.2%) |
| CIE-LAB | lab(49.98, -6.94, 7.50) |
| CIE-LCH | lch(49.98, 10.22, 132.77°) |
| OKLab | oklab(56.63% -0.0185 0.0195) |
| OKLCH | oklch(56.63% 0.027 133.6) |
| XYZ | xyz(16.2427, 18.4043, 16.3295) |
| Luminance | 0.1840 (WCAG relative) |
| Temperature | neutral |
| Family | grey |
Closest named colors
Medium Grey
#7D7F7C
ΔE00 8.27
Gray
#808080
ΔE00 10.57
Brown Grey
#8D8468
ΔE00 10.80
Green Grey
#77926F
ΔE00 11.05
Slate Green
#658D6D
ΔE00 11.30
Dimgray
#696969
ΔE00 11.35
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#707A6A #746A7A
analogous
#787A6A #707A6A #6A7A6C
triadic
#707A6A #6A707A #7A6A70
tetradic
#707A6A #6A787A #746A7A #7A6C6A
square
#707A6A #6A787A #746A7A #7A6C6A
split-complementary
#707A6A #6C6A7A #7A6A78
monochromatic
#343931 #52594E #707A6A #8F9889 #AEB5AA
Accessibility & contrast
On white
4.49
#707A6A on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
4.68
#707A6A on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #707A6A
4.68:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##707A6A | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##707A6A | 1.00 | 4.49 | 4.68 | 4.68 |
| #FFFFFF | 4.49 | 1.00 | 21.00 | 21.00 |
| #000000 | 4.68 | 21.00 | 1.00 | 1.00 |
| ##000000 | 4.68 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#7C7769
Deuteranopia (green-blind)
#7A776B
Tritanopia (blue-blind)
#707975
Achromatopsia (no color)
#777777
Design tokens & code
CSS
--color: #707a6a; /* rgb */ color: rgb(112, 122, 106); /* oklch */ color: oklch(56.6% 0.027 133.6);
Tailwind
colors: {
custom: {
50: '#99a094',
500: '#707a6a',
950: '#000000',
},
}SCSS
$custom: #707a6a; $custom-light: #99a094; $custom-dark: #000000;
JSON
{
"hex": "#707a6a",
"rgb": {
"r": 112,
"g": 122,
"b": 106
},
"hsl": {
"h": 97.5,
"s": 7.018,
"l": 44.706
},
"oklch": {
"l": 0.56629,
"c": 0.02689,
"h": 133.6
},
"luminance": 0.18404
}Semantic roles & 50–950 ramp
primary
#707A6A
secondary
#A19BA5
accent
#78B09B
background
#F9F9F9
surface
#F2F2F1
border
#CCCCCB
text
#0D0E0D
muted
#7E7E7E