#603712#603712
#603712 is a dark, moderate orange. Relative luminance 0.053; OKLCH L 38.0% C 0.077 H 58.8°. Best body text is #FFFFFF at 10.23:1 contrast (WCAG AA passes).
Color values
| HEX | #603712 |
|---|---|
| RGB | rgb(96, 55, 18) |
| HSL | hsl(28, 68%, 22%) |
| HSV | hsv(28, 81%, 38%) |
| CMYK | cmyk(0%, 42.7%, 81.3%, 62.4%) |
| CIE-LAB | lab(27.47, 14.97, 29.76) |
| CIE-LCH | lch(27.47, 33.31, 63.30°) |
| OKLab | oklab(38.03% 0.0397 0.0656) |
| OKLCH | oklch(38.03% 0.077 58.8) |
| XYZ | xyz(6.2998, 5.2635, 1.2563) |
| Luminance | 0.0526 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Brown (survey)
#653700
ΔE00 3.55
Chocolate
#7B3F00
ΔE00 7.26
Milk Chocolate
#7F4E1E
ΔE00 8.74
Chestnut
#742802
ΔE00 8.86
Mud Brown
#60460F
ΔE00 8.97
Espresso
#4B382A
ΔE00 9.95
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#603712 #123B60
analogous
#601214 #603712 #605E12
triadic
#603712 #126037 #371260
tetradic
#603712 #146012 #123B60 #5E1260
square
#603712 #146012 #123B60 #5E1260
split-complementary
#603712 #12605E #121460
monochromatic
#1A0F05 #2C1908 #603712 #94551C #C77225
Accessibility & contrast
On white
10.23
#603712 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.05
#603712 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #603712
10.23:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##603712 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##603712 | 1.00 | 10.23 | 2.05 | 10.23 |
| #FFFFFF | 10.23 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.05 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 10.23 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#433B0D
Deuteranopia (green-blind)
#4D4512
Tritanopia (blue-blind)
#6A2E2F
Achromatopsia (no color)
#414141
Design tokens & code
CSS
--color: #603712; /* rgb */ color: rgb(96, 55, 18); /* oklch */ color: oklch(38.0% 0.077 58.8);
Tailwind
colors: {
custom: {
50: '#926e52',
500: '#603712',
950: '#000000',
},
}SCSS
$custom: #603712; $custom-light: #926e52; $custom-dark: #000000;
JSON
{
"hex": "#603712",
"rgb": {
"r": 96,
"g": 55,
"b": 18
},
"hsl": {
"h": 28.462,
"s": 68.421,
"l": 22.353
},
"oklch": {
"l": 0.38029,
"c": 0.07669,
"h": 58.8
},
"luminance": 0.05263
}Semantic roles & 50–950 ramp
primary
#603712
secondary
#366998
accent
#98EB3D
background
#F9F6F4
surface
#F2EBE7
border
#CCC6C3
text
#0E0702
muted
#7E7A78