#D42D53#D42D53
#D42D53 is a mid, highly saturated red. Relative luminance 0.165; OKLCH L 57.4% C 0.201 H 14.1°. Best body text is #FFFFFF at 4.88:1 contrast (WCAG AA passes).
Color values
| HEX | #D42D53 |
|---|---|
| RGB | rgb(212, 45, 83) |
| HSL | hsl(346, 66%, 50%) |
| HSV | hsv(346, 79%, 83%) |
| CMYK | cmyk(0%, 78.8%, 60.8%, 16.9%) |
| CIE-LAB | lab(47.63, 64.86, 20.05) |
| CIE-LCH | lch(47.63, 67.89, 17.18°) |
| OKLab | oklab(57.4% 0.1949 0.049) |
| OKLCH | oklch(57.4% 0.201 14.1) |
| XYZ | xyz(29.6542, 16.5028, 9.8058) |
| Luminance | 0.1650 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Lipstick
#D5174E
ΔE00 1.92
Raspberry
#E30B5C
ΔE00 3.70
Cherry
#DE3163
ΔE00 4.03
Ruby
#CA0147
ΔE00 4.68
Cerise
#DE0C62
ΔE00 5.15
Deep Rose
#C74767
ΔE00 5.47
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#D42D53 #2DD4AE
analogous
#D42DA7 #D42D53 #D45A2D
triadic
#D42D53 #53D42D #2D53D4
tetradic
#D42D53 #A7D42D #2DD4AE #5A2DD4
square
#D42D53 #A7D42D #2DD4AE #5A2DD4
split-complementary
#D42D53 #2DD45A #2DA7D4
monochromatic
#70172B #A3213F #D42D53 #DE607D #E993A6
Accessibility & contrast
On white
4.88
#D42D53 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.30
#D42D53 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #D42D53
4.88:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##D42D53 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##D42D53 | 1.00 | 4.88 | 4.30 | 4.88 |
| #FFFFFF | 4.88 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.30 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.88 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#5D5B53
Deuteranopia (green-blind)
#887D4E
Tritanopia (blue-blind)
#E8003E
Achromatopsia (no color)
#717171
Design tokens & code
CSS
--color: #d42d53; /* rgb */ color: rgb(212, 45, 83); /* oklch */ color: oklch(57.4% 0.201 14.1);
Tailwind
colors: {
custom: {
50: '#e97683',
500: '#d42d53',
950: '#000000',
},
}SCSS
$custom: #d42d53; $custom-light: #e97683; $custom-dark: #000000;
JSON
{
"hex": "#d42d53",
"rgb": {
"r": 212,
"g": 45,
"b": 83
},
"hsl": {
"h": 346.347,
"s": 66.008,
"l": 50.392
},
"oklch": {
"l": 0.57402,
"c": 0.20097,
"h": 14.1
},
"luminance": 0.16498
}Semantic roles & 50–950 ramp
primary
#D42D53
secondary
#89D4C3
accent
#E9C23F
background
#FFF7F7
surface
#FFEEEE
border
#D7C9C9
text
#180A0A
muted
#867C7C