#EF4E4A#EF4E4A
#EF4E4A is a light, vivid red. Relative luminance 0.243; OKLCH L 64.8% C 0.198 H 25.8°. Best body text is #000000 at 5.86:1 contrast (WCAG AA passes).
Color values
| HEX | #EF4E4A |
|---|---|
| RGB | rgb(239, 78, 74) |
| HSL | hsl(1, 84%, 61%) |
| HSV | hsv(1, 69%, 94%) |
| CMYK | cmyk(0%, 67.4%, 69%, 6.3%) |
| CIE-LAB | lab(56.39, 61.31, 37.41) |
| CIE-LCH | lch(56.39, 71.82, 31.39°) |
| OKLab | oklab(64.76% 0.1784 0.0862) |
| OKLCH | oklch(64.76% 0.198 25.8) |
| XYZ | xyz(39.5613, 24.2997, 9.0844) |
| Luminance | 0.2429 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Light Red
#FF474C
ΔE00 2.70
Coral (survey)
#FC5A50
ΔE00 3.77
Grapefruit
#FD5956
ΔE00 3.79
Pale Red
#D9544D
ΔE00 3.85
Pastel Red
#DB5856
ΔE00 4.18
Strawberry (survey)
#FB2943
ΔE00 4.25
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#EF4E4A #4AEBEF
analogous
#EF4A98 #EF4E4A #EFA14A
triadic
#EF4E4A #4AEF4E #4E4AEF
tetradic
#EF4E4A #98EF4A #4AEBEF #A14AEF
square
#EF4E4A #98EF4A #4AEBEF #A14AEF
split-complementary
#EF4E4A #4AEFA1 #4A98EF
monochromatic
#AF130F #E71A14 #EF4E4A #F48582 #F9BCBA
Accessibility & contrast
On white
3.58
#EF4E4A on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.86
#EF4E4A on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #EF4E4A
5.86:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##EF4E4A | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##EF4E4A | 1.00 | 3.58 | 5.86 | 5.86 |
| #FFFFFF | 3.58 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.86 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.86 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#7B7148
Deuteranopia (green-blind)
#A39445
Tritanopia (blue-blind)
#FF1F4F
Achromatopsia (no color)
#878787
Design tokens & code
CSS
--color: #ef4e4a; /* rgb */ color: rgb(239, 78, 74); /* oklch */ color: oklch(64.8% 0.198 25.8);
Tailwind
colors: {
custom: {
50: '#fd887d',
500: '#ef4e4a',
950: '#000000',
},
}SCSS
$custom: #ef4e4a; $custom-light: #fd887d; $custom-dark: #000000;
JSON
{
"hex": "#ef4e4a",
"rgb": {
"r": 239,
"g": 78,
"b": 74
},
"hsl": {
"h": 1.455,
"s": 83.756,
"l": 61.373
},
"oklch": {
"l": 0.64761,
"c": 0.19815,
"h": 25.8
},
"luminance": 0.24294
}Semantic roles & 50–950 ramp
primary
#EF4E4A
secondary
#ACE8E9
accent
#DBE005
background
#FFF8F7
surface
#FFF0EE
border
#D7CBC9
text
#190C09
muted
#867D7B