#78331F#78331F
#78331F is a dark, moderate red. Relative luminance 0.065; OKLCH L 41.2% C 0.102 H 36.9°. Best body text is #FFFFFF at 9.16:1 contrast (WCAG AA passes).
Color values
| HEX | #78331F |
|---|---|
| RGB | rgb(120, 51, 31) |
| HSL | hsl(13, 59%, 30%) |
| HSV | hsv(13, 74%, 47%) |
| CMYK | cmyk(0%, 57.5%, 74.2%, 52.9%) |
| CIE-LAB | lab(30.55, 28.76, 26.96) |
| CIE-LCH | lch(30.55, 39.42, 43.16°) |
| OKLab | oklab(41.21% 0.0816 0.0613) |
| OKLCH | oklch(41.21% 0.102 36.9) |
| XYZ | xyz(9.1778, 6.4608, 2.0598) |
| Luminance | 0.0646 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Reddish Brown
#7F2B0A
ΔE00 4.52
Red Brown
#8B2E16
ΔE00 4.60
Chestnut
#742802
ΔE00 5.53
Rust Brown
#8B3103
ΔE00 7.17
Brown Red
#922B05
ΔE00 7.22
Indian Red
#850E04
ΔE00 7.25
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#78331F #1F6478
analogous
#781F38 #78331F #78601F
triadic
#78331F #1F7833 #331F78
tetradic
#78331F #38781F #1F6478 #601F78
square
#78331F #38781F #1F6478 #601F78
split-complementary
#78331F #1F7860 #1F3878
monochromatic
#180A06 #471E12 #78331F #A9482C #CE6243
Accessibility & contrast
On white
9.16
#78331F on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.29
#78331F on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #78331F
9.16:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##78331F | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##78331F | 1.00 | 9.16 | 2.29 | 9.16 |
| #FFFFFF | 9.16 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.29 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 9.16 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#463E1D
Deuteranopia (green-blind)
#574E1D
Tritanopia (blue-blind)
#84252F
Achromatopsia (no color)
#484848
Design tokens & code
CSS
--color: #78331f; /* rgb */ color: rgb(120, 51, 31); /* oklch */ color: oklch(41.2% 0.102 36.9);
Tailwind
colors: {
custom: {
50: '#a56d5b',
500: '#78331f',
950: '#000000',
},
}SCSS
$custom: #78331f; $custom-light: #a56d5b; $custom-dark: #000000;
JSON
{
"hex": "#78331f",
"rgb": {
"r": 120,
"g": 51,
"b": 31
},
"hsl": {
"h": 13.483,
"s": 58.94,
"l": 29.608
},
"oklch": {
"l": 0.41212,
"c": 0.10207,
"h": 36.9
},
"luminance": 0.0646
}Semantic roles & 50–950 ramp
primary
#78331F
secondary
#4795AB
accent
#BFE246
background
#FAF6F5
surface
#F4EBE9
border
#CEC6C5
text
#100704
muted
#7F7A79