#56559A#56559A
#56559A is a mid, moderate blue. Relative luminance 0.108; OKLCH L 48.4% C 0.109 H 282.2°. Best body text is #FFFFFF at 6.64:1 contrast (WCAG AA passes).
Color values
| HEX | #56559A |
|---|---|
| RGB | rgb(86, 85, 154) |
| HSL | hsl(241, 29%, 47%) |
| HSV | hsv(241, 45%, 60%) |
| CMYK | cmyk(44.2%, 44.8%, 0%, 39.6%) |
| CIE-LAB | lab(39.26, 18.90, -37.66) |
| CIE-LCH | lch(39.26, 42.14, 296.65°) |
| OKLab | oklab(48.37% 0.023 -0.1065) |
| OKLCH | oklch(48.37% 0.109 282.2) |
| XYZ | xyz(12.9173, 10.8080, 31.9711) |
| Luminance | 0.1081 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Twilight
#4E518B
ΔE00 2.98
Dusk
#4E5481
ΔE00 5.12
Dusky Blue
#475F94
ΔE00 6.32
Blueberry
#464196
ΔE00 6.54
Iris
#6258C4
ΔE00 7.13
Darkslateblue
#483D8B
ΔE00 7.60
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#56559A #999A55
analogous
#55779A #56559A #79559A
triadic
#56559A #9A5655 #559A56
tetradic
#56559A #9A5577 #999A55 #559A79
square
#56559A #9A5577 #999A55 #559A79
split-complementary
#56559A #9A7955 #779A55
monochromatic
#2A294B #403F73 #56559A #7978B4 #A09FCA
Accessibility & contrast
On white
6.64
#56559A on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.16
#56559A on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #56559A
6.64:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##56559A | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##56559A | 1.00 | 6.64 | 3.16 | 6.64 |
| #FFFFFF | 6.64 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.16 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.64 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#3B5F9D
Deuteranopia (green-blind)
#375A98
Tritanopia (blue-blind)
#416370
Achromatopsia (no color)
#5C5C5C
Design tokens & code
CSS
--color: #56559a; /* rgb */ color: rgb(86, 85, 154); /* oklch */ color: oklch(48.4% 0.109 282.2);
Tailwind
colors: {
custom: {
50: '#8984b8',
500: '#56559a',
950: '#000000',
},
}SCSS
$custom: #56559a; $custom-light: #8984b8; $custom-dark: #000000;
JSON
{
"hex": "#56559a",
"rgb": {
"r": 86,
"g": 85,
"b": 154
},
"hsl": {
"h": 240.87,
"s": 28.87,
"l": 46.863
},
"oklch": {
"l": 0.48369,
"c": 0.10896,
"h": 282.2
},
"luminance": 0.10809
}Semantic roles & 50–950 ramp
primary
#56559A
secondary
#B7B893
accent
#C563C4
background
#F8F8FB
surface
#F0EFF6
border
#CBCAD0
text
#0C0B11
muted
#7D7C80