#9F712C#9F712C
#9F712C is a mid, moderate orange. Relative luminance 0.194; OKLCH L 58.3% C 0.102 H 74.0°. Best body text is #000000 at 4.87:1 contrast (WCAG AA passes).
Color values
| HEX | #9F712C |
|---|---|
| RGB | rgb(159, 113, 44) |
| HSL | hsl(36, 57%, 40%) |
| HSV | hsv(36, 72%, 62%) |
| CMYK | cmyk(0%, 28.9%, 72.3%, 37.6%) |
| CIE-LAB | lab(51.11, 11.35, 43.94) |
| CIE-LCH | lch(51.11, 45.38, 75.51°) |
| OKLab | oklab(58.27% 0.0282 0.0984) |
| OKLCH | oklch(58.27% 0.102 74) |
| XYZ | xyz(20.6592, 19.3647, 5.0321) |
| Luminance | 0.1936 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Leather
#AC7434
ΔE00 4.05
Caramel (survey)
#AF6F09
ΔE00 5.13
Raw Sienna
#9A6200
ΔE00 5.92
Bronze (survey)
#A87900
ΔE00 6.35
Tan Brown
#AB7E4C
ΔE00 6.41
Coffee
#A6814C
ΔE00 6.42
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#9F712C #2C5A9F
analogous
#9F382C #9F712C #949F2C
triadic
#9F712C #2C9F71 #712C9F
tetradic
#9F712C #2C9F38 #2C5A9F #9F2C94
square
#9F712C #2C9F38 #2C5A9F #9F2C94
split-complementary
#9F712C #2C949F #382C9F
monochromatic
#3F2D11 #6F4F1F #9F712C #CA923E #D7AD6E
Accessibility & contrast
On white
4.31
#9F712C on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
4.87
#9F712C on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #9F712C
4.87:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##9F712C | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##9F712C | 1.00 | 4.31 | 4.87 | 4.87 |
| #FFFFFF | 4.31 | 1.00 | 21.00 | 21.00 |
| #000000 | 4.87 | 21.00 | 1.00 | 1.00 |
| ##000000 | 4.87 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#827323
Deuteranopia (green-blind)
#8C7E2E
Tritanopia (blue-blind)
#AD6563
Achromatopsia (no color)
#7A7A7A
Design tokens & code
CSS
--color: #9f712c; /* rgb */ color: rgb(159, 113, 44); /* oklch */ color: oklch(58.3% 0.102 74.0);
Tailwind
colors: {
custom: {
50: '#c09969',
500: '#9f712c',
950: '#000000',
},
}SCSS
$custom: #9f712c; $custom-light: #c09969; $custom-dark: #000000;
JSON
{
"hex": "#9f712c",
"rgb": {
"r": 159,
"g": 113,
"b": 44
},
"hsl": {
"h": 36,
"s": 56.65,
"l": 39.804
},
"oklch": {
"l": 0.58272,
"c": 0.1024,
"h": 74
},
"luminance": 0.19363
}Semantic roles & 50–950 ramp
primary
#9F712C
secondary
#698BBE
accent
#85E048
background
#FCF9F6
surface
#F8F2EB
border
#D1CCC6
text
#130E06
muted
#827E7A