#D43323#D43323
#D43323 is a mid, vivid red. Relative luminance 0.165; OKLCH L 57.2% C 0.200 H 30.0°. Best body text is #FFFFFF at 4.89:1 contrast (WCAG AA passes).
Color values
| HEX | #D43323 |
|---|---|
| RGB | rgb(212, 51, 35) |
| HSL | hsl(5, 72%, 48%) |
| HSV | hsv(5, 83%, 83%) |
| CMYK | cmyk(0%, 75.9%, 83.5%, 16.9%) |
| CIE-LAB | lab(47.61, 61.03, 47.54) |
| CIE-LCH | lch(47.61, 77.36, 37.92°) |
| OKLab | oklab(57.18% 0.1729 0.0999) |
| OKLCH | oklch(57.18% 0.2 30) |
| XYZ | xyz(28.6421, 16.4907, 3.2647) |
| Luminance | 0.1649 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Red (survey)
#E50000
ΔE00 4.21
Tomato Red
#EC2D01
ΔE00 6.44
Cherry Red
#F7022A
ΔE00 6.65
Reddish
#C44240
ΔE00 6.72
Tomato (survey)
#EF4026
ΔE00 6.87
Bright Red
#FF000D
ΔE00 7.57
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#D43323 #23C4D4
analogous
#D4236B #D43323 #D48B23
triadic
#D43323 #23D433 #3323D4
tetradic
#D43323 #6BD423 #23C4D4 #8B23D4
square
#D43323 #6BD423 #23C4D4 #8B23D4
split-complementary
#D43323 #23D48B #236BD4
monochromatic
#6B1A12 #9F261A #D43323 #E25F52 #EB8F86
Accessibility & contrast
On white
4.89
#D43323 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.30
#D43323 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #D43323
4.89:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##D43323 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##D43323 | 1.00 | 4.89 | 4.30 | 4.89 |
| #FFFFFF | 4.89 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.30 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.89 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#665A1F
Deuteranopia (green-blind)
#8D7E19
Tritanopia (blue-blind)
#EA0031
Achromatopsia (no color)
#717171
Design tokens & code
CSS
--color: #d43323; /* rgb */ color: rgb(212, 51, 35); /* oklch */ color: oklch(57.2% 0.200 30.0);
Tailwind
colors: {
custom: {
50: '#ec7861',
500: '#d43323',
950: '#000000',
},
}SCSS
$custom: #d43323; $custom-light: #ec7861; $custom-dark: #000000;
JSON
{
"hex": "#d43323",
"rgb": {
"r": 212,
"g": 51,
"b": 35
},
"hsl": {
"h": 5.424,
"s": 71.66,
"l": 48.431
},
"oklch": {
"l": 0.57184,
"c": 0.19969,
"h": 30
},
"luminance": 0.16486
}Semantic roles & 50–950 ramp
primary
#D43323
secondary
#7ECDD4
accent
#DEEE39
background
#FFF7F5
surface
#FFEEEA
border
#D7C9C6
text
#180A05
muted
#867C79