#6D3616#6D3616
#6D3616 is a dark, moderate orange. Relative luminance 0.059; OKLCH L 39.9% C 0.090 H 48.1°. Best body text is #FFFFFF at 9.59:1 contrast (WCAG AA passes).
Color values
| HEX | #6D3616 |
|---|---|
| RGB | rgb(109, 54, 22) |
| HSL | hsl(22, 66%, 26%) |
| HSV | hsv(22, 80%, 43%) |
| CMYK | cmyk(0%, 50.5%, 79.8%, 57.3%) |
| CIE-LAB | lab(29.28, 21.83, 30.15) |
| CIE-LCH | lch(29.28, 37.23, 54.09°) |
| OKLab | oklab(39.85% 0.0599 0.0667) |
| OKLCH | oklch(39.85% 0.09 48.1) |
| XYZ | xyz(7.7714, 5.9484, 1.4978) |
| Luminance | 0.0595 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Chestnut
#742802
ΔE00 4.91
Reddish Brown
#7F2B0A
ΔE00 6.01
Brown (survey)
#653700
ΔE00 6.53
Chocolate
#7B3F00
ΔE00 7.08
Rust Brown
#8B3103
ΔE00 7.43
Saddlebrown
#8B4513
ΔE00 7.85
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#6D3616 #164D6D
analogous
#6D1621 #6D3616 #6D6116
triadic
#6D3616 #166D36 #36166D
tetradic
#6D3616 #216D16 #164D6D #61166D
square
#6D3616 #216D16 #164D6D #61166D
split-complementary
#6D3616 #166D61 #16216D
monochromatic
#190D05 #3A1D0C #6D3616 #A04F20 #D3682B
Accessibility & contrast
On white
9.59
#6D3616 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.19
#6D3616 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #6D3616
9.59:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##6D3616 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##6D3616 | 1.00 | 9.59 | 2.19 | 9.59 |
| #FFFFFF | 9.59 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.19 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 9.59 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#463D12
Deuteranopia (green-blind)
#534A15
Tritanopia (blue-blind)
#782A2F
Achromatopsia (no color)
#454545
Design tokens & code
CSS
--color: #6d3616; /* rgb */ color: rgb(109, 54, 22); /* oklch */ color: oklch(39.9% 0.090 48.1);
Tailwind
colors: {
custom: {
50: '#9c6e55',
500: '#6d3616',
950: '#000000',
},
}SCSS
$custom: #6d3616; $custom-light: #9c6e55; $custom-dark: #000000;
JSON
{
"hex": "#6d3616",
"rgb": {
"r": 109,
"g": 54,
"b": 22
},
"hsl": {
"h": 22.069,
"s": 66.412,
"l": 25.686
},
"oklch": {
"l": 0.3985,
"c": 0.08961,
"h": 48.1
},
"luminance": 0.05947
}Semantic roles & 50–950 ramp
primary
#6D3616
secondary
#3C7DA3
accent
#AAE93E
background
#FAF6F5
surface
#F4ECE9
border
#CEC7C5
text
#0F0703
muted
#7F7A78