#7E56DD#7E56DD
#7E56DD is a mid, vivid violet. Relative luminance 0.163; OKLCH L 56.6% C 0.196 H 292.7°. Best body text is #FFFFFF at 4.93:1 contrast (WCAG AA passes).
Color values
| HEX | #7E56DD |
|---|---|
| RGB | rgb(126, 86, 221) |
| HSL | hsl(258, 67%, 60%) |
| HSV | hsv(258, 61%, 87%) |
| CMYK | cmyk(43%, 61.1%, 0%, 13.3%) |
| CIE-LAB | lab(47.38, 47.08, -63.52) |
| CIE-LCH | lch(47.38, 79.07, 306.55°) |
| OKLab | oklab(56.64% 0.0757 -0.1813) |
| OKLCH | oklch(56.64% 0.196 292.7) |
| XYZ | xyz(24.9796, 16.3109, 70.2248) |
| Luminance | 0.1631 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Closest named colors
Purpley
#8756E4
ΔE00 1.84
Light Indigo
#6D5ACF
ΔE00 3.75
Slate Blue
#6A5ACD
ΔE00 4.36
Dark Periwinkle
#665FD1
ΔE00 5.43
Mediumslateblue
#7B68EE
ΔE00 5.98
Iris
#6258C4
ΔE00 6.17
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#7E56DD #B5DD56
analogous
#5671DD #7E56DD #C256DD
triadic
#7E56DD #DD7E56 #56DD7E
tetradic
#7E56DD #DD5671 #B5DD56 #56DDC2
square
#7E56DD #DD5671 #B5DD56 #56DDC2
split-complementary
#7E56DD #DDC256 #71DD56
monochromatic
#431F9A #5A29CD #7E56DD #A589E7 #CCBCF2
Accessibility & contrast
On white
4.93
#7E56DD on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.26
#7E56DD on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #7E56DD
4.93:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##7E56DD | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##7E56DD | 1.00 | 4.93 | 4.26 | 4.93 |
| #FFFFFF | 4.93 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.26 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.93 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#0072E1
Deuteranopia (green-blind)
#006EDA
Tritanopia (blue-blind)
#637591
Achromatopsia (no color)
#707070
Design tokens & code
CSS
--color: #7e56dd; /* rgb */ color: rgb(126, 86, 221); /* oklch */ color: oklch(56.6% 0.196 292.7);
Tailwind
colors: {
custom: {
50: '#aa87e8',
500: '#7e56dd',
950: '#000000',
},
}SCSS
$custom: #7e56dd; $custom-light: #aa87e8; $custom-dark: #000000;
JSON
{
"hex": "#7e56dd",
"rgb": {
"r": 126,
"g": 86,
"b": 221
},
"hsl": {
"h": 257.778,
"s": 66.502,
"l": 60.196
},
"oklch": {
"l": 0.56644,
"c": 0.19646,
"h": 292.7
},
"luminance": 0.16312
}Semantic roles & 50–950 ramp
primary
#7E56DD
secondary
#D2E1AE
accent
#CE1798
background
#FAF8FE
surface
#F5F0FD
border
#CFCBD5
text
#110B16
muted
#807C84