#64697F#64697F
#64697F is a mid, muted blue. Relative luminance 0.143; OKLCH L 52.5% C 0.035 H 275.1°. Best body text is #FFFFFF at 5.43:1 contrast (WCAG AA passes).
Color values
| HEX | #64697F |
|---|---|
| RGB | rgb(100, 105, 127) |
| HSL | hsl(229, 12%, 45%) |
| HSV | hsv(229, 21%, 50%) |
| CMYK | cmyk(21.3%, 17.3%, 0%, 50.2%) |
| CIE-LAB | lab(44.72, 3.18, -12.84) |
| CIE-LCH | lch(44.72, 13.23, 283.91°) |
| OKLab | oklab(52.46% 0.0031 -0.035) |
| OKLCH | oklch(52.46% 0.035 275.1) |
| XYZ | xyz(14.1369, 14.3445, 22.0985) |
| Luminance | 0.1434 (WCAG relative) |
| Temperature | neutral |
| Family | blue |
Closest named colors
Slate Grey
#59656D
ΔE00 9.15
Slate
#516572
ΔE00 9.79
Purplish Grey
#7A687F
ΔE00 9.98
Dusk
#4E5481
ΔE00 10.17
Dimgray
#696969
ΔE00 10.47
Dusky Blue
#475F94
ΔE00 10.59
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#64697F #7F7A64
analogous
#64777F #64697F #6D647F
triadic
#64697F #7F6469 #697F64
tetradic
#64697F #7F6477 #7F7A64 #647F6D
square
#64697F #7F6477 #7F7A64 #647F6D
split-complementary
#64697F #7F6D64 #777F64
monochromatic
#2E303B #494D5D #64697F #83889D #A5A9B8
Accessibility & contrast
On white
5.43
#64697F on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.87
#64697F on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #64697F
5.43:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##64697F | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##64697F | 1.00 | 5.43 | 3.87 | 5.43 |
| #FFFFFF | 5.43 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.87 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.43 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#636B80
Deuteranopia (green-blind)
#61697E
Tritanopia (blue-blind)
#5E6D70
Achromatopsia (no color)
#6A6A6A
Design tokens & code
CSS
--color: #64697f; /* rgb */ color: rgb(100, 105, 127); /* oklch */ color: oklch(52.5% 0.035 275.1);
Tailwind
colors: {
custom: {
50: '#9093a4',
500: '#64697f',
950: '#000000',
},
}SCSS
$custom: #64697f; $custom-light: #9093a4; $custom-dark: #000000;
JSON
{
"hex": "#64697f",
"rgb": {
"r": 100,
"g": 105,
"b": 127
},
"hsl": {
"h": 228.889,
"s": 11.894,
"l": 44.51
},
"oklch": {
"l": 0.5246,
"c": 0.03516,
"h": 275.1
},
"luminance": 0.14345
}Semantic roles & 50–950 ramp
primary
#64697F
secondary
#A7A497
accent
#A973B5
background
#F8F9FA
surface
#F0F1F4
border
#CBCBCE
text
#0C0D0F
muted
#7D7E7F