#7B4022#7B4022
#7B4022 is a dark, moderate orange. Relative luminance 0.080; OKLCH L 43.9% C 0.092 H 46.1°. Best body text is #FFFFFF at 8.08:1 contrast (WCAG AA passes).
Color values
| HEX | #7B4022 |
|---|---|
| RGB | rgb(123, 64, 34) |
| HSL | hsl(20, 57%, 31%) |
| HSV | hsv(20, 72%, 48%) |
| CMYK | cmyk(0%, 48%, 72.4%, 51.8%) |
| CIE-LAB | lab(33.97, 22.92, 29.21) |
| CIE-LCH | lch(33.97, 37.13, 51.88°) |
| OKLab | oklab(43.94% 0.064 0.0666) |
| OKLCH | oklch(43.94% 0.092 46.1) |
| XYZ | xyz(10.2914, 7.9944, 2.5142) |
| Luminance | 0.0799 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Saddlebrown
#8B4513
ΔE00 5.66
Reddish Brown
#7F2B0A
ΔE00 6.20
Rust Brown
#8B3103
ΔE00 6.48
Chestnut
#742802
ΔE00 6.71
Red Brown
#8B2E16
ΔE00 7.03
Chocolate
#7B3F00
ΔE00 7.21
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#7B4022 #225D7B
analogous
#7B2230 #7B4022 #7B6C22
triadic
#7B4022 #227B40 #40227B
tetradic
#7B4022 #307B22 #225D7B #6C227B
square
#7B4022 #307B22 #225D7B #6C227B
split-complementary
#7B4022 #227B6C #22307B
monochromatic
#1B0E07 #4B2715 #7B4022 #AB592F #CD764A
Accessibility & contrast
On white
8.08
#7B4022 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.60
#7B4022 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #7B4022
8.08:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##7B4022 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##7B4022 | 1.00 | 8.08 | 2.60 | 8.08 |
| #FFFFFF | 8.08 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.60 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 8.08 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#50481F
Deuteranopia (green-blind)
#5F5521
Tritanopia (blue-blind)
#873439
Achromatopsia (no color)
#505050
Design tokens & code
CSS
--color: #7b4022; /* rgb */ color: rgb(123, 64, 34); /* oklch */ color: oklch(43.9% 0.092 46.1);
Tailwind
colors: {
custom: {
50: '#a6765e',
500: '#7b4022',
950: '#000000',
},
}SCSS
$custom: #7b4022; $custom-light: #a6765e; $custom-dark: #000000;
JSON
{
"hex": "#7b4022",
"rgb": {
"r": 123,
"g": 64,
"b": 34
},
"hsl": {
"h": 20.225,
"s": 56.688,
"l": 30.784
},
"oklch": {
"l": 0.43935,
"c": 0.09238,
"h": 46.1
},
"luminance": 0.07993
}Semantic roles & 50–950 ramp
primary
#7B4022
secondary
#4B8CAE
accent
#ADE048
background
#FAF7F5
surface
#F4EDE9
border
#CEC8C5
text
#100804
muted
#7F7B79