#A8553A#A8553A
#A8553A is a mid, moderate red. Relative luminance 0.151; OKLCH L 54.5% C 0.116 H 38.6°. Best body text is #FFFFFF at 5.22:1 contrast (WCAG AA passes).
Color values
| HEX | #A8553A |
|---|---|
| RGB | rgb(168, 85, 58) |
| HSL | hsl(15, 49%, 44%) |
| HSV | hsv(15, 65%, 66%) |
| CMYK | cmyk(0%, 49.4%, 65.5%, 34.1%) |
| CIE-LAB | lab(45.81, 31.77, 31.06) |
| CIE-LCH | lch(45.81, 44.43, 44.35°) |
| OKLab | oklab(54.48% 0.091 0.0727) |
| OKLCH | oklch(54.48% 0.116 38.6) |
| XYZ | xyz(20.1624, 15.1296, 5.8607) |
| Luminance | 0.1513 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Sienna
#A0522D
ΔE00 3.92
Clay
#B66A50
ΔE00 7.19
Rust
#B7410E
ΔE00 7.40
Earth
#A2653E
ΔE00 7.50
Sienna (survey)
#A9561E
ΔE00 7.67
Burnt Sienna
#B04E0F
ΔE00 8.06
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#A8553A #3A8DA8
analogous
#A83A56 #A8553A #A88C3A
triadic
#A8553A #3AA855 #553AA8
tetradic
#A8553A #56A83A #3A8DA8 #8C3AA8
square
#A8553A #56A83A #3A8DA8 #8C3AA8
split-complementary
#A8553A #3AA88C #3A56A8
monochromatic
#4D271B #7B3E2A #A8553A #C67459 #D69A87
Accessibility & contrast
On white
5.22
#A8553A on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.03
#A8553A on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #A8553A
5.22:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##A8553A | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##A8553A | 1.00 | 5.22 | 4.03 | 5.22 |
| #FFFFFF | 5.22 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.03 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.22 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#6B6137
Deuteranopia (green-blind)
#7F7339
Tritanopia (blue-blind)
#B8454F
Achromatopsia (no color)
#6C6C6C
Design tokens & code
CSS
--color: #a8553a; /* rgb */ color: rgb(168, 85, 58); /* oklch */ color: oklch(54.5% 0.116 38.6);
Tailwind
colors: {
custom: {
50: '#c78671',
500: '#a8553a',
950: '#000000',
},
}SCSS
$custom: #a8553a; $custom-light: #c78671; $custom-dark: #000000;
JSON
{
"hex": "#a8553a",
"rgb": {
"r": 168,
"g": 85,
"b": 58
},
"hsl": {
"h": 14.727,
"s": 48.673,
"l": 44.314
},
"oklch": {
"l": 0.54481,
"c": 0.11646,
"h": 38.6
},
"luminance": 0.15127
}Semantic roles & 50–950 ramp
primary
#A8553A
secondary
#7EB0C0
accent
#B7D850
background
#FCF8F6
surface
#F9EFEC
border
#D2CAC7
text
#140B07
muted
#827C7A