#69686A#69686A
#69686A is a mid, near-neutral grey. Relative luminance 0.139; OKLCH L 51.9% C 0.003 H 308.4°. Best body text is #FFFFFF at 5.54:1 contrast (WCAG AA passes).
Color values
| HEX | #69686A |
|---|---|
| RGB | rgb(105, 104, 106) |
| HSL | hsl(270, 1%, 41%) |
| HSV | hsv(270, 2%, 42%) |
| CMYK | cmyk(0.9%, 1.9%, 0%, 58.4%) |
| CIE-LAB | lab(44.15, 0.80, -0.98) |
| CIE-LCH | lch(44.15, 1.27, 309.15°) |
| OKLab | oklab(51.89% 0.0021 -0.0026) |
| OKLCH | oklch(51.89% 0.003 308.4) |
| XYZ | xyz(13.3771, 13.9445, 15.6197) |
| Luminance | 0.1394 (WCAG relative) |
| Temperature | neutral |
| Family | grey |
Closest named colors
Dimgray
#696969
ΔE00 1.52
Slate Grey
#59656D
ΔE00 6.77
Gunmetal (survey)
#536267
ΔE00 8.40
Flint
#6F7A80
ΔE00 8.58
Gray
#808080
ΔE00 9.51
Medium Grey
#7D7F7C
ΔE00 9.52
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#69686A #696A68
analogous
#68686A #69686A #6A686A
triadic
#69686A #6A6968 #686A69
tetradic
#69686A #6A6868 #696A68 #686A6A
square
#69686A #6A6868 #696A68 #686A6A
split-complementary
#69686A #6A6A68 #686A68
monochromatic
#2C2B2C #4A4A4B #69686A #888689 #A6A5A7
Accessibility & contrast
On white
5.54
#69686A on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.79
#69686A on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #69686A
5.54:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##69686A | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##69686A | 1.00 | 5.54 | 3.79 | 5.54 |
| #FFFFFF | 5.54 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.79 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.54 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#68686A
Deuteranopia (green-blind)
#68686A
Tritanopia (blue-blind)
#696869
Achromatopsia (no color)
#686868
Design tokens & code
CSS
--color: #69686a; /* rgb */ color: rgb(105, 104, 106); /* oklch */ color: oklch(51.9% 0.003 308.4);
Tailwind
colors: {
custom: {
50: '#939394',
500: '#69686a',
950: '#000000',
},
}SCSS
$custom: #69686a; $custom-light: #939394; $custom-dark: #000000;
JSON
{
"hex": "#69686a",
"rgb": {
"r": 105,
"g": 104,
"b": 106
},
"hsl": {
"h": 270,
"s": 0.952,
"l": 41.176
},
"oklch": {
"l": 0.51886,
"c": 0.00333,
"h": 308.4
},
"luminance": 0.13944
}Semantic roles & 50–950 ramp
primary
#69686A
secondary
#979896
accent
#AA7E94
background
#F9F9F9
surface
#F1F1F1
border
#CBCBCB
text
#0D0D0D
muted
#7E7E7E