#616563#616563
#616563 is a mid, near-neutral grey. Relative luminance 0.128; OKLCH L 50.3% C 0.006 H 164.9°. Best body text is #FFFFFF at 5.92:1 contrast (WCAG AA passes).
Color values
| HEX | #616563 |
|---|---|
| RGB | rgb(97, 101, 99) |
| HSL | hsl(150, 2%, 39%) |
| HSV | hsv(150, 4%, 40%) |
| CMYK | cmyk(4%, 0%, 2%, 60.4%) |
| CIE-LAB | lab(42.38, -1.97, 0.59) |
| CIE-LCH | lch(42.38, 2.06, 163.36°) |
| OKLab | oklab(50.26% -0.0057 0.0015) |
| OKLCH | oklch(50.26% 0.006 164.9) |
| XYZ | xyz(11.8352, 12.7495, 13.6394) |
| Luminance | 0.1275 (WCAG relative) |
| Temperature | neutral |
| Family | grey |
Closest named colors
Dimgray
#696969
ΔE00 3.39
Gunmetal (survey)
#536267
ΔE00 5.80
Slate Grey
#59656D
ΔE00 5.93
Slate
#516572
ΔE00 8.82
Flint
#6F7A80
ΔE00 9.24
Medium Grey
#7D7F7C
ΔE00 10.45
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#616563 #656163
analogous
#616561 #616563 #616565
triadic
#616563 #636165 #656361
tetradic
#616563 #616165 #656163 #656561
square
#616563 #616165 #656163 #656561
split-complementary
#616563 #656165 #656161
monochromatic
#252726 #434644 #616563 #7F8482 #9EA2A0
Accessibility & contrast
On white
5.92
#616563 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.55
#616563 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #616563
5.92:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##616563 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##616563 | 1.00 | 5.92 | 3.55 | 5.92 |
| #FFFFFF | 5.92 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.55 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.92 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#656463
Deuteranopia (green-blind)
#646463
Tritanopia (blue-blind)
#606564
Achromatopsia (no color)
#646464
Design tokens & code
CSS
--color: #616563; /* rgb */ color: rgb(97, 101, 99); /* oklch */ color: oklch(50.3% 0.006 164.9);
Tailwind
colors: {
custom: {
50: '#8d908f',
500: '#616563',
950: '#000000',
},
}SCSS
$custom: #616563; $custom-light: #8d908f; $custom-dark: #000000;
JSON
{
"hex": "#616563",
"rgb": {
"r": 97,
"g": 101,
"b": 99
},
"hsl": {
"h": 150,
"s": 2.02,
"l": 38.824
},
"oklch": {
"l": 0.50257,
"c": 0.00586,
"h": 164.9
},
"luminance": 0.1275
}Semantic roles & 50–950 ramp
primary
#616563
secondary
#928F91
accent
#7D94AB
background
#F8F8F8
surface
#F0F0F0
border
#CBCBCB
text
#0C0C0C
muted
#7D7D7D