#D97560#D97560
#D97560 is a light, vivid red. Relative luminance 0.283; OKLCH L 67.1% C 0.130 H 33.0°. Best body text is #000000 at 6.66:1 contrast (WCAG AA passes).
Color values
| HEX | #D97560 |
|---|---|
| RGB | rgb(217, 117, 96) |
| HSL | hsl(10, 61%, 61%) |
| HSV | hsv(10, 56%, 85%) |
| CMYK | cmyk(0%, 46.1%, 55.8%, 14.9%) |
| CIE-LAB | lab(60.18, 37.02, 29.03) |
| CIE-LCH | lch(60.18, 47.05, 38.10°) |
| OKLab | oklab(67.07% 0.1087 0.0706) |
| OKLCH | oklch(67.07% 0.13 33) |
| XYZ | xyz(37.0906, 28.3227, 14.5776) |
| Luminance | 0.2832 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Dark Peach
#DE7E5D
ΔE00 4.42
Terracotta
#C96F4A
ΔE00 6.56
Terracota
#CB6843
ΔE00 6.92
Orange Pink
#FF6F52
ΔE00 6.93
Salmon
#FA8072
ΔE00 6.95
Salmon (survey)
#FF796C
ΔE00 7.24
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#D97560 #60C4D9
analogous
#D96088 #D97560 #D9B260
triadic
#D97560 #60D975 #7560D9
tetradic
#D97560 #88D960 #60C4D9 #B260D9
square
#D97560 #88D960 #60C4D9 #B260D9
split-complementary
#D97560 #60D9B2 #6088D9
monochromatic
#9A3925 #CB4B31 #D97560 #E5A091 #F1CBC3
Accessibility & contrast
On white
3.15
#D97560 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
6.66
#D97560 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #D97560
6.66:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##D97560 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##D97560 | 1.00 | 3.15 | 6.66 | 6.66 |
| #FFFFFF | 3.15 | 1.00 | 21.00 | 21.00 |
| #000000 | 6.66 | 21.00 | 1.00 | 1.00 |
| ##000000 | 6.66 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#8E845E
Deuteranopia (green-blind)
#A6995E
Tritanopia (blue-blind)
#EC6470
Achromatopsia (no color)
#919191
Design tokens & code
CSS
--color: #d97560; /* rgb */ color: rgb(217, 117, 96); /* oklch */ color: oklch(67.1% 0.130 33.0);
Tailwind
colors: {
custom: {
50: '#e99e8d',
500: '#d97560',
950: '#000000',
},
}SCSS
$custom: #d97560; $custom-light: #e99e8d; $custom-dark: #000000;
JSON
{
"hex": "#d97560",
"rgb": {
"r": 217,
"g": 117,
"b": 96
},
"hsl": {
"h": 10.413,
"s": 61.421,
"l": 61.373
},
"oklch": {
"l": 0.67072,
"c": 0.12956,
"h": 33
},
"luminance": 0.28319
}Semantic roles & 50–950 ramp
primary
#D97560
secondary
#B4D9E1
accent
#ABC91C
background
#FEF9F8
surface
#FDF2F0
border
#D5CCCB
text
#170E0C
muted
#857E7D