#9F563C#9F563C
#9F563C is a mid, moderate orange. Relative luminance 0.144; OKLCH L 53.4% C 0.104 H 40.1°. Best body text is #FFFFFF at 5.43:1 contrast (WCAG AA passes).
Color values
| HEX | #9F563C |
|---|---|
| RGB | rgb(159, 86, 60) |
| HSL | hsl(16, 45%, 43%) |
| HSV | hsv(16, 62%, 62%) |
| CMYK | cmyk(0%, 45.9%, 62.3%, 37.6%) |
| CIE-LAB | lab(44.74, 27.67, 28.30) |
| CIE-LCH | lch(44.74, 39.58, 45.65°) |
| OKLab | oklab(53.4% 0.0796 0.0671) |
| OKLCH | oklch(53.4% 0.104 40.1) |
| XYZ | xyz(18.4429, 14.3547, 6.0736) |
| Luminance | 0.1435 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Sienna
#A0522D
ΔE00 3.52
Earth
#A2653E
ΔE00 6.89
Sienna (survey)
#A9561E
ΔE00 7.78
Clay
#B66A50
ΔE00 8.00
Burnt Umber
#A0450E
ΔE00 8.16
Brownish
#9C6D57
ΔE00 8.37
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#9F563C #3C859F
analogous
#9F3C53 #9F563C #9F873C
triadic
#9F563C #3C9F56 #563C9F
tetradic
#9F563C #539F3C #3C859F #873C9F
square
#9F563C #539F3C #3C859F #873C9F
split-complementary
#9F563C #3C9F87 #3C539F
monochromatic
#46261A #733E2B #9F563C #C07358 #D19985
Accessibility & contrast
On white
5.43
#9F563C on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.87
#9F563C on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #9F563C
5.43:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##9F563C | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##9F563C | 1.00 | 5.43 | 3.87 | 5.43 |
| #FFFFFF | 5.43 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.87 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.43 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#69603A
Deuteranopia (green-blind)
#7B703B
Tritanopia (blue-blind)
#AD4950
Achromatopsia (no color)
#6A6A6A
Design tokens & code
CSS
--color: #9f563c; /* rgb */ color: rgb(159, 86, 60); /* oklch */ color: oklch(53.4% 0.104 40.1);
Tailwind
colors: {
custom: {
50: '#c08772',
500: '#9f563c',
950: '#000000',
},
}SCSS
$custom: #9f563c; $custom-light: #c08772; $custom-dark: #000000;
JSON
{
"hex": "#9f563c",
"rgb": {
"r": 159,
"g": 86,
"b": 60
},
"hsl": {
"h": 15.758,
"s": 45.205,
"l": 42.941
},
"oklch": {
"l": 0.53399,
"c": 0.10415,
"h": 40.1
},
"luminance": 0.14353
}Semantic roles & 50–950 ramp
primary
#9F563C
secondary
#7CAABB
accent
#B3D553
background
#FCF8F6
surface
#F8EFEC
border
#D1CAC7
text
#130B08
muted
#827C7B