#63271B#63271B
#63271B is a dark, moderate red. Relative luminance 0.042; OKLCH L 35.7% C 0.090 H 33.0°. Best body text is #FFFFFF at 11.43:1 contrast (WCAG AA passes).
Color values
| HEX | #63271B |
|---|---|
| RGB | rgb(99, 39, 27) |
| HSL | hsl(10, 57%, 25%) |
| HSV | hsv(10, 73%, 39%) |
| CMYK | cmyk(0%, 60.6%, 72.7%, 61.2%) |
| CIE-LAB | lab(24.27, 26.28, 21.22) |
| CIE-LCH | lch(24.27, 33.78, 38.93°) |
| OKLab | oklab(35.71% 0.0755 0.0491) |
| OKLCH | oklch(35.71% 0.09 33) |
| XYZ | xyz(6.0695, 4.1836, 1.5246) |
| Luminance | 0.0418 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Reddy Brown
#6E1005
ΔE00 5.93
Rosewood
#65000B
ΔE00 7.13
Blood
#770001
ΔE00 7.82
Chestnut
#742802
ΔE00 8.13
Reddish Brown
#7F2B0A
ΔE00 8.54
Chocolate Brown
#411900
ΔE00 8.73
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#63271B #1B5763
analogous
#631B33 #63271B #634B1B
triadic
#63271B #1B6327 #271B63
tetradic
#63271B #33631B #1B5763 #4B1B63
square
#63271B #33631B #1B5763 #4B1B63
split-complementary
#63271B #1B634B #1B3363
monochromatic
#180907 #33140E #63271B #933A28 #C34D35
Accessibility & contrast
On white
11.43
#63271B on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.84
#63271B on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #63271B
11.43:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##63271B | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##63271B | 1.00 | 11.43 | 1.84 | 11.43 |
| #FFFFFF | 11.43 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.84 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 11.43 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#37321A
Deuteranopia (green-blind)
#463F19
Tritanopia (blue-blind)
#6D1B24
Achromatopsia (no color)
#3A3A3A
Design tokens & code
CSS
--color: #63271b; /* rgb */ color: rgb(99, 39, 27); /* oklch */ color: oklch(35.7% 0.090 33.0);
Tailwind
colors: {
custom: {
50: '#946357',
500: '#63271b',
950: '#000000',
},
}SCSS
$custom: #63271b; $custom-light: #946357; $custom-dark: #000000;
JSON
{
"hex": "#63271b",
"rgb": {
"r": 99,
"g": 39,
"b": 27
},
"hsl": {
"h": 10,
"s": 57.143,
"l": 24.706
},
"oklch": {
"l": 0.35712,
"c": 0.09008,
"h": 33
},
"luminance": 0.04183
}Semantic roles & 50–950 ramp
primary
#63271B
secondary
#418A98
accent
#C7E047
background
#F9F6F5
surface
#F2EBE9
border
#CCC6C5
text
#0E0503
muted
#7E7A78