#9F6C22#9F6C22
#9F6C22 is a mid, moderate orange. Relative luminance 0.182; OKLCH L 57.2% C 0.108 H 71.8°. Best body text is #000000 at 4.64:1 contrast (WCAG AA passes).
Color values
| HEX | #9F6C22 |
|---|---|
| RGB | rgb(159, 108, 34) |
| HSL | hsl(36, 65%, 38%) |
| HSV | hsv(36, 79%, 62%) |
| CMYK | cmyk(0%, 32.1%, 78.6%, 37.6%) |
| CIE-LAB | lab(49.75, 13.73, 47.01) |
| CIE-LCH | lch(49.75, 48.97, 73.72°) |
| OKLab | oklab(57.19% 0.0338 0.1028) |
| OKLCH | oklch(57.19% 0.108 71.8) |
| XYZ | xyz(19.9509, 18.2133, 3.9778) |
| Luminance | 0.1821 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Raw Sienna
#9A6200
ΔE00 3.98
Caramel (survey)
#AF6F09
ΔE00 4.39
Leather
#AC7434
ΔE00 4.49
Raw Umber
#A75E09
ΔE00 6.52
Umber (survey)
#B26400
ΔE00 6.54
Poo Brown
#885F01
ΔE00 7.09
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#9F6C22 #22559F
analogous
#9F2D22 #9F6C22 #939F22
triadic
#9F6C22 #229F6C #6C229F
tetradic
#9F6C22 #229F2D #22559F #9F2293
square
#9F6C22 #229F2D #22559F #9F2293
split-complementary
#9F6C22 #22939F #2D229F
monochromatic
#3A280C #6D4A17 #9F6C22 #D18E2D #DDA95F
Accessibility & contrast
On white
4.52
#9F6C22 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.64
#9F6C22 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #9F6C22
4.64:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##9F6C22 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##9F6C22 | 1.00 | 4.52 | 4.64 | 4.64 |
| #FFFFFF | 4.52 | 1.00 | 21.00 | 21.00 |
| #000000 | 4.64 | 21.00 | 1.00 | 1.00 |
| ##000000 | 4.64 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#7E6F16
Deuteranopia (green-blind)
#8A7B24
Tritanopia (blue-blind)
#AE5F5D
Achromatopsia (no color)
#767676
Design tokens & code
CSS
--color: #9f6c22; /* rgb */ color: rgb(159, 108, 34); /* oklch */ color: oklch(57.2% 0.108 71.8);
Tailwind
colors: {
custom: {
50: '#c09663',
500: '#9f6c22',
950: '#000000',
},
}SCSS
$custom: #9f6c22; $custom-light: #c09663; $custom-dark: #000000;
JSON
{
"hex": "#9f6c22",
"rgb": {
"r": 159,
"g": 108,
"b": 34
},
"hsl": {
"h": 35.52,
"s": 64.767,
"l": 37.843
},
"oklch": {
"l": 0.57188,
"c": 0.10821,
"h": 71.8
},
"luminance": 0.18212
}Semantic roles & 50–950 ramp
primary
#9F6C22
secondary
#5B85C1
accent
#84E840
background
#FCF9F6
surface
#F8F1EB
border
#D1CBC6
text
#130D05
muted
#827E7A