#662C15#662C15
#662C15 is a dark, moderate orange. Relative luminance 0.047; OKLCH L 37.0% C 0.091 H 41.1°. Best body text is #FFFFFF at 10.85:1 contrast (WCAG AA passes).
Color values
| HEX | #662C15 |
|---|---|
| RGB | rgb(102, 44, 21) |
| HSL | hsl(17, 66%, 24%) |
| HSV | hsv(17, 79%, 40%) |
| CMYK | cmyk(0%, 56.9%, 79.4%, 60%) |
| CIE-LAB | lab(25.81, 24.44, 26.73) |
| CIE-LCH | lch(25.81, 36.22, 47.56°) |
| OKLab | oklab(36.96% 0.0683 0.0595) |
| OKLCH | oklch(36.96% 0.091 41.1) |
| XYZ | xyz(6.5162, 4.6811, 1.2697) |
| Luminance | 0.0468 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Chestnut
#742802
ΔE00 4.87
Reddish Brown
#7F2B0A
ΔE00 6.04
Reddy Brown
#6E1005
ΔE00 7.01
Red Brown
#8B2E16
ΔE00 8.06
Chocolate Brown
#411900
ΔE00 8.64
Blood
#770001
ΔE00 8.90
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#662C15 #154F66
analogous
#661527 #662C15 #665515
triadic
#662C15 #15662C #2C1566
tetradic
#662C15 #276615 #154F66 #551566
square
#662C15 #276615 #154F66 #551566
split-complementary
#662C15 #156655 #152766
monochromatic
#190B05 #33160B #662C15 #99421F #CC582A
Accessibility & contrast
On white
10.85
#662C15 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.94
#662C15 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #662C15
10.85:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##662C15 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##662C15 | 1.00 | 10.85 | 1.94 | 10.85 |
| #FFFFFF | 10.85 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.94 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 10.85 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#3C3512
Deuteranopia (green-blind)
#4A4214
Tritanopia (blue-blind)
#702027
Achromatopsia (no color)
#3D3D3D
Design tokens & code
CSS
--color: #662c15; /* rgb */ color: rgb(102, 44, 21); /* oklch */ color: oklch(37.0% 0.091 41.1);
Tailwind
colors: {
custom: {
50: '#976753',
500: '#662c15',
950: '#000000',
},
}SCSS
$custom: #662c15; $custom-light: #976753; $custom-dark: #000000;
JSON
{
"hex": "#662c15",
"rgb": {
"r": 102,
"g": 44,
"b": 21
},
"hsl": {
"h": 17.037,
"s": 65.854,
"l": 24.118
},
"oklch": {
"l": 0.36959,
"c": 0.09058,
"h": 41.1
},
"luminance": 0.0468
}Semantic roles & 50–950 ramp
primary
#662C15
secondary
#3A819D
accent
#B9E93F
background
#F9F6F4
surface
#F2EBE7
border
#CCC6C3
text
#0E0602
muted
#7E7A78