#587BC0#587BC0
#587BC0 is a mid, moderate blue. Relative luminance 0.200; OKLCH L 58.8% C 0.114 H 262.9°. Best body text is #000000 at 5.01:1 contrast (WCAG AA passes).
Color values
| HEX | #587BC0 |
|---|---|
| RGB | rgb(88, 123, 192) |
| HSL | hsl(220, 45%, 55%) |
| HSV | hsv(220, 54%, 75%) |
| CMYK | cmyk(54.2%, 35.9%, 0%, 24.7%) |
| CIE-LAB | lab(51.89, 7.81, -39.92) |
| CIE-LCH | lch(51.89, 40.68, 281.07°) |
| OKLab | oklab(58.77% -0.014 -0.1128) |
| OKLCH | oklch(58.77% 0.114 262.9) |
| XYZ | xyz(20.6187, 20.0448, 52.6415) |
| Luminance | 0.2005 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Cornflower Blue
#5170D7
ΔE00 4.68
Windows Blue
#3778BF
ΔE00 5.23
Off Blue
#5684AE
ΔE00 5.33
Dusty Blue
#5A86AD
ΔE00 5.84
Faded Blue
#658CBB
ΔE00 6.03
Cool Blue
#4984B8
ΔE00 6.11
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#587BC0 #C09D58
analogous
#58AFC0 #587BC0 #6958C0
triadic
#587BC0 #C0587B #7BC058
tetradic
#587BC0 #C058AF #C09D58 #58C069
square
#587BC0 #C058AF #C09D58 #58C069
split-complementary
#587BC0 #C06958 #AFC058
monochromatic
#2B4372 #3C5D9F #587BC0 #849ED1 #B1C1E2
Accessibility & contrast
On white
4.19
#587BC0 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.01
#587BC0 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #587BC0
5.01:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##587BC0 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##587BC0 | 1.00 | 4.19 | 5.01 | 5.01 |
| #FFFFFF | 4.19 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.01 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.01 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#5F81C3
Deuteranopia (green-blind)
#5377BF
Tritanopia (blue-blind)
#1E8A94
Achromatopsia (no color)
#7C7C7C
Design tokens & code
CSS
--color: #587bc0; /* rgb */ color: rgb(88, 123, 192); /* oklch */ color: oklch(58.8% 0.114 262.9);
Tailwind
colors: {
custom: {
50: '#8ea0d3',
500: '#587bc0',
950: '#000000',
},
}SCSS
$custom: #587bc0; $custom-light: #8ea0d3; $custom-dark: #000000;
JSON
{
"hex": "#587bc0",
"rgb": {
"r": 88,
"g": 123,
"b": 192
},
"hsl": {
"h": 219.808,
"s": 45.217,
"l": 54.902
},
"oklch": {
"l": 0.5877,
"c": 0.11367,
"h": 262.9
},
"luminance": 0.20046
}Semantic roles & 50–950 ramp
primary
#587BC0
secondary
#D0C1A4
accent
#A953D5
background
#F9F9FD
surface
#F1F2FA
border
#CBCCD3
text
#0D0E14
muted
#7E7E83