#DA5564#DA5564
#DA5564 is a light, vivid red. Relative luminance 0.223; OKLCH L 62.7% C 0.167 H 16.6°. Best body text is #000000 at 5.46:1 contrast (WCAG AA passes).
Color values
| HEX | #DA5564 |
|---|---|
| RGB | rgb(218, 85, 100) |
| HSL | hsl(353, 64%, 59%) |
| HSV | hsv(353, 61%, 85%) |
| CMYK | cmyk(0%, 61%, 54.1%, 14.5%) |
| CIE-LAB | lab(54.37, 53.22, 19.08) |
| CIE-LCH | lch(54.37, 56.54, 19.73°) |
| OKLab | oklab(62.73% 0.1597 0.0476) |
| OKLCH | oklch(62.73% 0.167 16.6) |
| XYZ | xyz(34.4651, 22.3269, 14.5487) |
| Luminance | 0.2232 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Indianred
#CD5C5C
ΔE00 4.12
Rose (survey)
#CF6275
ΔE00 4.79
Pastel Red
#DB5856
ΔE00 5.03
Faded Red
#D3494E
ΔE00 5.33
Red Pink
#FA2A55
ΔE00 6.11
Dark Coral
#CF524E
ΔE00 6.24
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#DA5564 #55DACB
analogous
#DA55A7 #DA5564 #DA8955
triadic
#DA5564 #64DA55 #5564DA
tetradic
#DA5564 #A7DA55 #55DACB #8955DA
square
#DA5564 #A7DA55 #55DACB #8955DA
split-complementary
#DA5564 #55DA89 #55A7DA
monochromatic
#94202D #C72B3D #DA5564 #E58792 #F0BAC0
Accessibility & contrast
On white
3.84
#DA5564 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.46
#DA5564 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #DA5564
5.46:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##DA5564 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##DA5564 | 1.00 | 3.84 | 5.46 | 5.46 |
| #FFFFFF | 3.84 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.46 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.46 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#757164
Deuteranopia (green-blind)
#968C61
Tritanopia (blue-blind)
#ED3E5B
Achromatopsia (no color)
#828282
Design tokens & code
CSS
--color: #da5564; /* rgb */ color: rgb(218, 85, 100); /* oklch */ color: oklch(62.7% 0.167 16.6);
Tailwind
colors: {
custom: {
50: '#eb8b90',
500: '#da5564',
950: '#000000',
},
}SCSS
$custom: #da5564; $custom-light: #eb8b90; $custom-dark: #000000;
JSON
{
"hex": "#da5564",
"rgb": {
"r": 218,
"g": 85,
"b": 100
},
"hsl": {
"h": 353.233,
"s": 64.251,
"l": 59.412
},
"oklch": {
"l": 0.6273,
"c": 0.16667,
"h": 16.6
},
"luminance": 0.22323
}Semantic roles & 50–950 ramp
primary
#DA5564
secondary
#ABDFD9
accent
#E7D441
background
#FFF8F8
surface
#FFF0F0
border
#D7CBCB
text
#170C0C
muted
#857D7D