#4E376C#4E376C
#4E376C is a dark, moderate violet. Relative luminance 0.054; OKLCH L 38.8% C 0.090 H 302.4°. Best body text is #FFFFFF at 10.06:1 contrast (WCAG AA passes).
Color values
| HEX | #4E376C |
|---|---|
| RGB | rgb(78, 55, 108) |
| HSL | hsl(266, 33%, 32%) |
| HSV | hsv(266, 49%, 42%) |
| CMYK | cmyk(27.8%, 49.1%, 0%, 57.6%) |
| CIE-LAB | lab(27.94, 22.31, -27.20) |
| CIE-LCH | lch(27.94, 35.18, 309.36°) |
| OKLab | oklab(38.79% 0.0484 -0.0762) |
| OKLCH | oklch(38.79% 0.09 302.4) |
| XYZ | xyz(7.2142, 5.4348, 14.8534) |
| Luminance | 0.0544 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Closest named colors
Darkslateblue
#483D8B
ΔE00 7.39
Blueberry
#464196
ΔE00 9.60
Rebeccapurple
#663399
ΔE00 9.60
Grape
#6C3461
ΔE00 9.75
Twilight
#4E518B
ΔE00 10.29
Dusk
#4E5481
ΔE00 10.97
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#4E376C #556C37
analogous
#373B6C #4E376C #69376C
triadic
#4E376C #6C4E37 #376C4E
tetradic
#4E376C #6C373B #556C37 #376C69
square
#4E376C #6C373B #556C37 #376C69
split-complementary
#4E376C #6C6937 #3B6C37
monochromatic
#130E1B #312243 #4E376C #6B4C95 #8A6AB3
Accessibility & contrast
On white
10.06
#4E376C on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.09
#4E376C on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #4E376C
10.06:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##4E376C | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##4E376C | 1.00 | 10.06 | 2.09 | 10.06 |
| #FFFFFF | 10.06 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.09 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 10.06 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#28416E
Deuteranopia (green-blind)
#2D426B
Tritanopia (blue-blind)
#49404C
Achromatopsia (no color)
#424242
Design tokens & code
CSS
--color: #4e376c; /* rgb */ color: rgb(78, 55, 108); /* oklch */ color: oklch(38.8% 0.090 302.4);
Tailwind
colors: {
custom: {
50: '#816e96',
500: '#4e376c',
950: '#000000',
},
}SCSS
$custom: #4e376c; $custom-light: #816e96; $custom-dark: #000000;
JSON
{
"hex": "#4e376c",
"rgb": {
"r": 78,
"g": 55,
"b": 108
},
"hsl": {
"h": 266.038,
"s": 32.515,
"l": 31.961
},
"oklch": {
"l": 0.3879,
"c": 0.09027,
"h": 302.4
},
"luminance": 0.05435
}Semantic roles & 50–950 ramp
primary
#4E376C
secondary
#839C62
accent
#C95F9B
background
#F8F6F9
surface
#EFECF2
border
#CAC7CC
text
#0A070D
muted
#7C7A7E