#616986#616986
#616986 is a mid, muted blue. Relative luminance 0.144; OKLCH L 52.5% C 0.047 H 272.7°. Best body text is #FFFFFF at 5.42:1 contrast (WCAG AA passes).
Color values
| HEX | #616986 |
|---|---|
| RGB | rgb(97, 105, 134) |
| HSL | hsl(227, 16%, 45%) |
| HSV | hsv(227, 28%, 53%) |
| CMYK | cmyk(27.6%, 21.6%, 0%, 47.5%) |
| CIE-LAB | lab(44.75, 3.96, -17.02) |
| CIE-LCH | lch(44.75, 17.47, 283.11°) |
| OKLab | oklab(52.51% 0.0022 -0.0468) |
| OKLCH | oklch(52.51% 0.047 272.7) |
| XYZ | xyz(14.2833, 14.3654, 24.5699) |
| Luminance | 0.1437 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Dusky Blue
#475F94
ΔE00 8.28
Dusk
#4E5481
ΔE00 8.48
Denim (survey)
#3B638C
ΔE00 9.97
Cadet Blue
#4E7496
ΔE00 10.02
Twilight
#4E518B
ΔE00 10.23
Denim Blue
#3B5B92
ΔE00 10.24
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#616986 #867E61
analogous
#617B86 #616986 #6B6186
triadic
#616986 #866169 #698661
tetradic
#616986 #86617B #867E61 #61866B
square
#616986 #86617B #867E61 #61866B
split-complementary
#616986 #866B61 #7B8661
monochromatic
#2E313F #474D62 #616986 #8188A4 #A4AABD
Accessibility & contrast
On white
5.42
#616986 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.87
#616986 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #616986
5.42:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##616986 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##616986 | 1.00 | 5.42 | 3.87 | 5.42 |
| #FFFFFF | 5.42 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.87 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.42 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#606B87
Deuteranopia (green-blind)
#5E6885
Tritanopia (blue-blind)
#586E73
Achromatopsia (no color)
#6A6A6A
Design tokens & code
CSS
--color: #616986; /* rgb */ color: rgb(97, 105, 134); /* oklch */ color: oklch(52.5% 0.047 272.7);
Tailwind
colors: {
custom: {
50: '#8e93a9',
500: '#616986',
950: '#000000',
},
}SCSS
$custom: #616986; $custom-light: #8e93a9; $custom-dark: #000000;
JSON
{
"hex": "#616986",
"rgb": {
"r": 97,
"g": 105,
"b": 134
},
"hsl": {
"h": 227.027,
"s": 16.017,
"l": 45.294
},
"oklch": {
"l": 0.52512,
"c": 0.04682,
"h": 272.7
},
"luminance": 0.14366
}Semantic roles & 50–950 ramp
primary
#616986
secondary
#ACA797
accent
#A96FB9
background
#F8F9FA
surface
#F0F1F4
border
#CBCBCE
text
#0C0D0F
muted
#7D7E7F