#4E4A60#4E4A60
#4E4A60 is a dark, muted violet. Relative luminance 0.074; OKLCH L 42.2% C 0.036 H 293.1°. Best body text is #FFFFFF at 8.49:1 contrast (WCAG AA passes).
Color values
| HEX | #4E4A60 |
|---|---|
| RGB | rgb(78, 74, 96) |
| HSL | hsl(251, 13%, 33%) |
| HSV | hsv(251, 23%, 38%) |
| CMYK | cmyk(18.7%, 22.9%, 0%, 62.4%) |
| CIE-LAB | lab(32.62, 6.81, -12.28) |
| CIE-LCH | lch(32.62, 14.04, 299.01°) |
| OKLab | oklab(42.17% 0.0143 -0.0335) |
| OKLCH | oklch(42.17% 0.036 293.1) |
| XYZ | xyz(7.7015, 7.3617, 12.0793) |
| Luminance | 0.0736 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Closest named colors
Dusk
#4E5481
ΔE00 8.93
Twilight
#4E518B
ΔE00 11.45
Dirty Purple
#734A65
ΔE00 12.78
Purplish Grey
#7A687F
ΔE00 13.17
Charcoal
#36454F
ΔE00 13.30
Navy Blue
#1B2A4A
ΔE00 13.38
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#4E4A60 #5C604A
analogous
#4A5160 #4E4A60 #594A60
triadic
#4E4A60 #604E4A #4A604E
tetradic
#4E4A60 #604A51 #5C604A #4A6059
square
#4E4A60 #604A51 #5C604A #4A6059
split-complementary
#4E4A60 #60594A #51604A
monochromatic
#16151B #322F3D #4E4A60 #6A6583 #8984A0
Accessibility & contrast
On white
8.49
#4E4A60 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.47
#4E4A60 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #4E4A60
8.49:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##4E4A60 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##4E4A60 | 1.00 | 8.49 | 2.47 | 8.49 |
| #FFFFFF | 8.49 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.47 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 8.49 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#454D61
Deuteranopia (green-blind)
#454C5F
Tritanopia (blue-blind)
#4B4D51
Achromatopsia (no color)
#4D4D4D
Design tokens & code
CSS
--color: #4e4a60; /* rgb */ color: rgb(78, 74, 96); /* oklch */ color: oklch(42.2% 0.036 293.1);
Tailwind
colors: {
custom: {
50: '#7f7c8d',
500: '#4e4a60',
950: '#000000',
},
}SCSS
$custom: #4e4a60; $custom-light: #7f7c8d; $custom-dark: #000000;
JSON
{
"hex": "#4e4a60",
"rgb": {
"r": 78,
"g": 74,
"b": 96
},
"hsl": {
"h": 250.909,
"s": 12.941,
"l": 33.333
},
"oklch": {
"l": 0.42168,
"c": 0.03646,
"h": 293.1
},
"luminance": 0.07362
}Semantic roles & 50–950 ramp
primary
#4E4A60
secondary
#8A8E78
accent
#B672A9
background
#F7F7F8
surface
#EEEEF0
border
#C9C9CB
text
#0A090C
muted
#7C7B7D