#A03F22#A03F22
#A03F22 is a mid, vivid red. Relative luminance 0.111; OKLCH L 49.6% C 0.136 H 37.0°. Best body text is #FFFFFF at 6.50:1 contrast (WCAG AA passes).
Color values
| HEX | #A03F22 |
|---|---|
| RGB | rgb(160, 63, 34) |
| HSL | hsl(14, 65%, 38%) |
| HSV | hsv(14, 79%, 63%) |
| CMYK | cmyk(0%, 60.6%, 78.8%, 37.3%) |
| CIE-LAB | lab(39.83, 38.66, 37.27) |
| CIE-LCH | lch(39.83, 53.70, 43.95°) |
| OKLab | oklab(49.59% 0.1086 0.0818) |
| OKLCH | oklch(49.59% 0.136 37) |
| XYZ | xyz(16.5652, 11.1464, 2.7922) |
| Luminance | 0.1114 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Brick
#A03623
ΔE00 3.16
Brownish Red
#9E3623
ΔE00 3.23
Rusty Red
#AF2F0D
ΔE00 4.18
Rust (survey)
#A83C09
ΔE00 4.52
Russet
#A13905
ΔE00 4.65
Rust Red
#AA2704
ΔE00 4.88
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#A03F22 #2283A0
analogous
#A02244 #A03F22 #A07E22
triadic
#A03F22 #22A03F #3F22A0
tetradic
#A03F22 #44A022 #2283A0 #7E22A0
square
#A03F22 #44A022 #2283A0 #7E22A0
split-complementary
#A03F22 #22A07E #2244A0
monochromatic
#3B170D #6E2B17 #A03F22 #D2532D #DD7C5F
Accessibility & contrast
On white
6.50
#A03F22 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.23
#A03F22 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #A03F22
6.50:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##A03F22 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##A03F22 | 1.00 | 6.50 | 3.23 | 6.50 |
| #FFFFFF | 6.50 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.23 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.50 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#5A501E
Deuteranopia (green-blind)
#72661F
Tritanopia (blue-blind)
#B02839
Achromatopsia (no color)
#5E5E5E
Design tokens & code
CSS
--color: #a03f22; /* rgb */ color: rgb(160, 63, 34); /* oklch */ color: oklch(49.6% 0.136 37.0);
Tailwind
colors: {
custom: {
50: '#c3785f',
500: '#a03f22',
950: '#000000',
},
}SCSS
$custom: #a03f22; $custom-light: #c3785f; $custom-dark: #000000;
JSON
{
"hex": "#a03f22",
"rgb": {
"r": 160,
"g": 63,
"b": 34
},
"hsl": {
"h": 13.81,
"s": 64.948,
"l": 38.039
},
"oklch": {
"l": 0.49589,
"c": 0.1359,
"h": 37
},
"luminance": 0.11144
}Semantic roles & 50–950 ramp
primary
#A03F22
secondary
#5CAAC2
accent
#C1E840
background
#FDF7F5
surface
#FAEDE9
border
#D3C8C5
text
#140904
muted
#837B79