#525E56#525E56
#525E56 is a mid, near-neutral grey. Relative luminance 0.105; OKLCH L 46.9% C 0.020 H 156.4°. Best body text is #FFFFFF at 6.79:1 contrast (WCAG AA passes).
Color values
| HEX | #525E56 |
|---|---|
| RGB | rgb(82, 94, 86) |
| HSL | hsl(140, 7%, 35%) |
| HSV | hsv(140, 13%, 37%) |
| CMYK | cmyk(12.8%, 0%, 8.5%, 63.1%) |
| CIE-LAB | lab(38.67, -6.41, 3.02) |
| CIE-LCH | lch(38.67, 7.09, 154.80°) |
| OKLab | oklab(46.9% -0.018 0.0079) |
| OKLCH | oklch(46.9% 0.02 156.4) |
| XYZ | xyz(9.1617, 10.4710, 10.3407) |
| Luminance | 0.1047 (WCAG relative) |
| Temperature | neutral |
| Family | grey |
Closest named colors
Gunmetal (survey)
#536267
ΔE00 7.44
Darkslategray
#2F4F4F
ΔE00 9.60
Dimgray
#696969
ΔE00 9.70
Slate Grey
#59656D
ΔE00 9.75
Charcoal Grey
#3C4142
ΔE00 11.36
Slate
#516572
ΔE00 11.59
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#525E56 #5E525A
analogous
#545E52 #525E56 #525E5C
triadic
#525E56 #56525E #5E5652
tetradic
#525E56 #52545E #5E525A #5E5C52
square
#525E56 #52545E #5E525A #5E5C52
split-complementary
#525E56 #5C525E #5E5254
monochromatic
#191D1A #353D38 #525E56 #6F7F74 #8E9C93
Accessibility & contrast
On white
6.79
#525E56 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.09
#525E56 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #525E56
6.79:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##525E56 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##525E56 | 1.00 | 6.79 | 3.09 | 6.79 |
| #FFFFFF | 6.79 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.09 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.79 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#5E5C56
Deuteranopia (green-blind)
#5C5A56
Tritanopia (blue-blind)
#505E5C
Achromatopsia (no color)
#5B5B5B
Design tokens & code
CSS
--color: #525e56; /* rgb */ color: rgb(82, 94, 86); /* oklch */ color: oklch(46.9% 0.020 156.4);
Tailwind
colors: {
custom: {
50: '#828b85',
500: '#525e56',
950: '#000000',
},
}SCSS
$custom: #525e56; $custom-light: #828b85; $custom-dark: #000000;
JSON
{
"hex": "#525e56",
"rgb": {
"r": 82,
"g": 94,
"b": 86
},
"hsl": {
"h": 140,
"s": 6.818,
"l": 34.51
},
"oklch": {
"l": 0.46897,
"c": 0.01962,
"h": 156.4
},
"luminance": 0.10471
}Semantic roles & 50–950 ramp
primary
#525E56
secondary
#8C8088
accent
#789DB0
background
#F7F8F8
surface
#EEF0EF
border
#C9CBCA
text
#0A0C0B
muted
#7C7D7C