#C74E2A#C74E2A
#C74E2A is a mid, vivid red. Relative luminance 0.178; OKLCH L 58.0% C 0.162 H 36.8°. Best body text is #FFFFFF at 4.61:1 contrast (WCAG AA passes).
Color values
| HEX | #C74E2A |
|---|---|
| RGB | rgb(199, 78, 42) |
| HSL | hsl(14, 65%, 47%) |
| HSV | hsv(14, 79%, 78%) |
| CMYK | cmyk(0%, 60.8%, 78.9%, 22%) |
| CIE-LAB | lab(49.21, 46.40, 44.78) |
| CIE-LCH | lch(49.21, 64.48, 43.99°) |
| OKLab | oklab(57.97% 0.13 0.0974) |
| OKLCH | oklch(57.97% 0.162 36.8) |
| XYZ | xyz(26.6984, 17.7618, 4.2125) |
| Luminance | 0.1776 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Brick Orange
#C14A09
ΔE00 5.43
Terra Cotta
#C9643B
ΔE00 5.83
Rust
#B7410E
ΔE00 5.87
Terracotta (survey)
#CA6641
ΔE00 6.25
Deep Orange
#DC4D01
ΔE00 6.65
Terracota
#CB6843
ΔE00 6.83
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#C74E2A #2AA3C7
analogous
#C72A55 #C74E2A #C79D2A
triadic
#C74E2A #2AC74E #4E2AC7
tetradic
#C74E2A #55C72A #2AA3C7 #9D2AC7
square
#C74E2A #55C72A #2AA3C7 #9D2AC7
split-complementary
#C74E2A #2AC79D #2A55C7
monochromatic
#622615 #943A1F #C74E2A #DB7253 #E59C86
Accessibility & contrast
On white
4.61
#C74E2A on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.55
#C74E2A on #000000
AA ✓AA large ✓AAA ✗
Best text color
#FFFFFF on #C74E2A
4.61:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##C74E2A | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##C74E2A | 1.00 | 4.61 | 4.55 | 4.61 |
| #FFFFFF | 4.61 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.55 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.61 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#706425
Deuteranopia (green-blind)
#8E7F26
Tritanopia (blue-blind)
#DB3047
Achromatopsia (no color)
#757575
Design tokens & code
CSS
--color: #c74e2a; /* rgb */ color: rgb(199, 78, 42); /* oklch */ color: oklch(58.0% 0.162 36.8);
Tailwind
colors: {
custom: {
50: '#e08466',
500: '#c74e2a',
950: '#000000',
},
}SCSS
$custom: #c74e2a; $custom-light: #e08466; $custom-dark: #000000;
JSON
{
"hex": "#c74e2a",
"rgb": {
"r": 199,
"g": 78,
"b": 42
},
"hsl": {
"h": 13.758,
"s": 65.145,
"l": 47.255
},
"oklch": {
"l": 0.57968,
"c": 0.16248,
"h": 36.8
},
"luminance": 0.17758
}Semantic roles & 50–950 ramp
primary
#C74E2A
secondary
#7EBCCF
accent
#C1E840
background
#FFF8F6
surface
#FEEFEB
border
#D6CAC6
text
#170B06
muted
#857C7A