#5954BD#5954BD
#5954BD is a mid, vivid blue. Relative luminance 0.121; OKLCH L 50.8% C 0.160 H 281.2°. Best body text is #FFFFFF at 6.13:1 contrast (WCAG AA passes).
Color values
| HEX | #5954BD |
|---|---|
| RGB | rgb(89, 84, 189) |
| HSL | hsl(243, 44%, 54%) |
| HSV | hsv(243, 56%, 74%) |
| CMYK | cmyk(52.9%, 55.6%, 0%, 25.9%) |
| CIE-LAB | lab(41.43, 31.21, -54.87) |
| CIE-LCH | lch(41.43, 63.13, 299.63°) |
| OKLab | oklab(50.77% 0.0311 -0.157) |
| OKLCH | oklch(50.77% 0.16 281.2) |
| XYZ | xyz(16.4726, 12.1376, 49.6090) |
| Luminance | 0.1214 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Iris
#6258C4
ΔE00 2.10
Slate Blue
#6A5ACD
ΔE00 4.04
Light Indigo
#6D5ACF
ΔE00 4.60
Warm Blue
#4B57DB
ΔE00 4.68
Dark Periwinkle
#665FD1
ΔE00 4.79
Ocean Blue
#4F42B5
ΔE00 5.41
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#5954BD #B8BD54
analogous
#5483BD #5954BD #8D54BD
triadic
#5954BD #BD5954 #54BD59
tetradic
#5954BD #BD5483 #B8BD54 #54BD8D
square
#5954BD #BD5483 #B8BD54 #54BD8D
split-complementary
#5954BD #BD8D54 #83BD54
monochromatic
#2D2A6D #3F3B99 #5954BD #8480CE #AFACDF
Accessibility & contrast
On white
6.13
#5954BD on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.43
#5954BD on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #5954BD
6.13:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##5954BD | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##5954BD | 1.00 | 6.13 | 3.43 | 6.13 |
| #FFFFFF | 6.13 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.43 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.13 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#0E66C1
Deuteranopia (green-blind)
#005EBB
Tritanopia (blue-blind)
#2E6C80
Achromatopsia (no color)
#626262
Design tokens & code
CSS
--color: #5954bd; /* rgb */ color: rgb(89, 84, 189); /* oklch */ color: oklch(50.8% 0.160 281.2);
Tailwind
colors: {
custom: {
50: '#9084d2',
500: '#5954bd',
950: '#000000',
},
}SCSS
$custom: #5954bd; $custom-light: #9084d2; $custom-dark: #000000;
JSON
{
"hex": "#5954bd",
"rgb": {
"r": 89,
"g": 84,
"b": 189
},
"hsl": {
"h": 242.857,
"s": 44.304,
"l": 53.529
},
"oklch": {
"l": 0.50773,
"c": 0.16001,
"h": 281.2
},
"luminance": 0.12139
}Semantic roles & 50–950 ramp
primary
#5954BD
secondary
#CBCDA0
accent
#D454CE
background
#F9F8FC
surface
#F2EFF9
border
#CCCAD2
text
#0D0B14
muted
#7E7C82