#877CDC#877CDC
#877CDC is a light, vivid blue. Relative luminance 0.247; OKLCH L 63.8% C 0.141 H 286.9°. Best body text is #000000 at 5.95:1 contrast (WCAG AA passes).
Color values
| HEX | #877CDC |
|---|---|
| RGB | rgb(135, 124, 220) |
| HSL | hsl(247, 58%, 67%) |
| HSV | hsv(247, 44%, 86%) |
| CMYK | cmyk(38.6%, 43.6%, 0%, 13.7%) |
| CIE-LAB | lab(56.81, 27.01, -47.80) |
| CIE-LCH | lch(56.81, 54.90, 299.47°) |
| OKLab | oklab(63.84% 0.0411 -0.1348) |
| OKLCH | oklch(63.84% 0.141 286.9) |
| XYZ | xyz(30.1140, 24.7325, 70.8835) |
| Luminance | 0.2473 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Mediumpurple
#9370DB
ΔE00 4.94
Perrywinkle
#8F8CE7
ΔE00 4.95
Periwinkle (survey)
#8E82FE
ΔE00 5.14
Lavender Blue
#8B88F8
ΔE00 5.29
Cornflower
#6A79F7
ΔE00 6.81
Mediumslateblue
#7B68EE
ΔE00 6.89
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#877CDC #D1DC7C
analogous
#7CA1DC #877CDC #B77CDC
triadic
#877CDC #DC877C #7CDC87
tetradic
#877CDC #DC7CA1 #D1DC7C #7CDCB7
square
#877CDC #DC7CA1 #D1DC7C #7CDCB7
split-complementary
#877CDC #DCB77C #A1DC7C
monochromatic
#3D2FAF #5B4CCF #877CDC #B3ACE9 #DFDDF6
Accessibility & contrast
On white
3.53
#877CDC on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.95
#877CDC on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #877CDC
5.95:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##877CDC | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##877CDC | 1.00 | 3.53 | 5.95 | 5.95 |
| #FFFFFF | 3.53 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.95 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.95 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#5A8BE0
Deuteranopia (green-blind)
#5986DA
Tritanopia (blue-blind)
#708FA1
Achromatopsia (no color)
#888888
Design tokens & code
CSS
--color: #877cdc; /* rgb */ color: rgb(135, 124, 220); /* oklch */ color: oklch(63.8% 0.141 286.9);
Tailwind
colors: {
custom: {
50: '#ada2e7',
500: '#877cdc',
950: '#000000',
},
}SCSS
$custom: #877cdc; $custom-light: #ada2e7; $custom-dark: #000000;
JSON
{
"hex": "#877cdc",
"rgb": {
"r": 135,
"g": 124,
"b": 220
},
"hsl": {
"h": 246.875,
"s": 57.831,
"l": 67.451
},
"oklch": {
"l": 0.63837,
"c": 0.14092,
"h": 286.9
},
"luminance": 0.24734
}Semantic roles & 50–950 ramp
primary
#877CDC
secondary
#E5E9CB
accent
#C520B2
background
#FAF9FE
surface
#F5F2FC
border
#CFCCD5
text
#110F16
muted
#807E84