#C54859#C54859
#C54859 is a mid, vivid red. Relative luminance 0.172; OKLCH L 57.6% C 0.159 H 15.6°. Best body text is #FFFFFF at 4.72:1 contrast (WCAG AA passes).
Color values
| HEX | #C54859 |
|---|---|
| RGB | rgb(197, 72, 89) |
| HSL | hsl(352, 52%, 53%) |
| HSV | hsv(352, 63%, 77%) |
| CMYK | cmyk(0%, 63.5%, 54.8%, 22.7%) |
| CIE-LAB | lab(48.55, 51.06, 17.18) |
| CIE-LCH | lch(48.55, 53.87, 18.59°) |
| OKLab | oklab(57.63% 0.1535 0.0429) |
| OKLCH | oklch(57.63% 0.159 15.6) |
| XYZ | xyz(27.1489, 17.2298, 11.3453) |
| Luminance | 0.1723 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Dusty Red
#B9484E
ΔE00 3.71
Dark Rose
#B5485D
ΔE00 4.19
Deep Rose
#C74767
ΔE00 4.36
Faded Red
#D3494E
ΔE00 5.41
Lipstick
#D5174E
ΔE00 5.55
Cherry
#DE3163
ΔE00 5.70
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#C54859 #48C5B4
analogous
#C54897 #C54859 #C57548
triadic
#C54859 #59C548 #4859C5
tetradic
#C54859 #97C548 #48C5B4 #7548C5
square
#C54859 #97C548 #48C5B4 #7548C5
split-complementary
#C54859 #48C575 #4897C5
monochromatic
#6F232E #9E3241 #C54859 #D47683 #E2A5AD
Accessibility & contrast
On white
4.72
#C54859 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.45
#C54859 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #C54859
4.72:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##C54859 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##C54859 | 1.00 | 4.72 | 4.45 | 4.72 |
| #FFFFFF | 4.72 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.45 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.72 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#666359
Deuteranopia (green-blind)
#867D56
Tritanopia (blue-blind)
#D7314F
Achromatopsia (no color)
#737373
Design tokens & code
CSS
--color: #c54859; /* rgb */ color: rgb(197, 72, 89); /* oklch */ color: oklch(57.6% 0.159 15.6);
Tailwind
colors: {
custom: {
50: '#dc8187',
500: '#c54859',
950: '#000000',
},
}SCSS
$custom: #c54859; $custom-light: #dc8187; $custom-dark: #000000;
JSON
{
"hex": "#c54859",
"rgb": {
"r": 197,
"g": 72,
"b": 89
},
"hsl": {
"h": 351.84,
"s": 51.867,
"l": 52.745
},
"oklch": {
"l": 0.57631,
"c": 0.15932,
"h": 15.6
},
"luminance": 0.17226
}Semantic roles & 50–950 ramp
primary
#C54859
secondary
#99CFC8
accent
#DBC84C
background
#FEF8F8
surface
#FCEFEF
border
#D5CACA
text
#160B0B
muted
#847C7C