#97642E#97642E
#97642E is a mid, moderate orange. Relative luminance 0.159; OKLCH L 54.7% C 0.096 H 64.8°. Best body text is #FFFFFF at 5.03:1 contrast (WCAG AA passes).
Color values
| HEX | #97642E |
|---|---|
| RGB | rgb(151, 100, 46) |
| HSL | hsl(31, 53%, 39%) |
| HSV | hsv(31, 70%, 59%) |
| CMYK | cmyk(0%, 33.8%, 69.5%, 40.8%) |
| CIE-LAB | lab(46.83, 15.31, 38.11) |
| CIE-LCH | lch(46.83, 41.07, 68.12°) |
| OKLab | oklab(54.73% 0.0408 0.0867) |
| OKLCH | oklch(54.73% 0.096 64.8) |
| XYZ | xyz(17.8141, 15.8925, 4.7136) |
| Luminance | 0.1589 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Sepia
#985E2B
ΔE00 2.86
Raw Umber
#A75E09
ΔE00 5.74
Raw Sienna
#9A6200
ΔE00 5.74
Earth
#A2653E
ΔE00 5.96
Dirt Brown
#836539
ΔE00 6.49
Leather
#AC7434
ΔE00 6.93
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#97642E #2E6197
analogous
#972F2E #97642E #95972E
triadic
#97642E #2E9764 #642E97
tetradic
#97642E #2E972F #2E6197 #972E95
square
#97642E #2E972F #2E6197 #972E95
split-complementary
#97642E #2E9597 #2F2E97
monochromatic
#392611 #684520 #97642E #C4833E #D2A16D
Accessibility & contrast
On white
5.03
#97642E on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.18
#97642E on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #97642E
5.03:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##97642E | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##97642E | 1.00 | 5.03 | 4.18 | 5.03 |
| #FFFFFF | 5.03 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.18 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.03 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#746828
Deuteranopia (green-blind)
#80742F
Tritanopia (blue-blind)
#A55858
Achromatopsia (no color)
#6F6F6F
Design tokens & code
CSS
--color: #97642e; /* rgb */ color: rgb(151, 100, 46); /* oklch */ color: oklch(54.7% 0.096 64.8);
Tailwind
colors: {
custom: {
50: '#ba9069',
500: '#97642e',
950: '#000000',
},
}SCSS
$custom: #97642e; $custom-light: #ba9069; $custom-dark: #000000;
JSON
{
"hex": "#97642e",
"rgb": {
"r": 151,
"g": 100,
"b": 46
},
"hsl": {
"h": 30.857,
"s": 53.299,
"l": 38.627
},
"oklch": {
"l": 0.54731,
"c": 0.09582,
"h": 64.8
},
"luminance": 0.15891
}Semantic roles & 50–950 ramp
primary
#97642E
secondary
#678FBA
accent
#92DD4B
background
#FBF8F6
surface
#F7F0EB
border
#D0CBC6
text
#120C06
muted
#817D7A