#7C641E#7C641E
#7C641E is a mid, moderate orange. Relative luminance 0.135; OKLCH L 51.4% C 0.091 H 89.3°. Best body text is #FFFFFF at 5.68:1 contrast (WCAG AA passes).
Color values
| HEX | #7C641E |
|---|---|
| RGB | rgb(124, 100, 30) |
| HSL | hsl(45, 61%, 30%) |
| HSV | hsv(45, 76%, 49%) |
| CMYK | cmyk(0%, 19.4%, 75.8%, 51.4%) |
| CIE-LAB | lab(43.50, 1.84, 41.24) |
| CIE-LCH | lch(43.50, 41.28, 87.44°) |
| OKLab | oklab(51.36% 0.0011 0.0914) |
| OKLCH | oklch(51.36% 0.091 89.3) |
| XYZ | xyz(13.1044, 13.4940, 3.1424) |
| Luminance | 0.1349 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Mud
#735C12
ΔE00 3.06
Shit
#7F5F00
ΔE00 3.67
Poop
#7F5E00
ΔE00 3.94
Muddy Brown
#886806
ΔE00 4.22
Poop Brown
#7A5901
ΔE00 4.79
Shit Brown
#7B5804
ΔE00 5.32
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#7C641E #1E367C
analogous
#7C351E #7C641E #657C1E
triadic
#7C641E #1E7C64 #641E7C
tetradic
#7C641E #1E7C35 #1E367C #7C1E65
square
#7C641E #1E7C35 #1E367C #7C1E65
split-complementary
#7C641E #1E657C #351E7C
monochromatic
#191506 #4B3C12 #7C641E #AD8C2A #D1AD43
Accessibility & contrast
On white
5.68
#7C641E on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.70
#7C641E on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #7C641E
5.68:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##7C641E | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##7C641E | 1.00 | 5.68 | 3.70 | 5.68 |
| #FFFFFF | 5.68 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.70 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.68 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#706313
Deuteranopia (green-blind)
#766A22
Tritanopia (blue-blind)
#875B56
Achromatopsia (no color)
#676767
Design tokens & code
CSS
--color: #7c641e; /* rgb */ color: rgb(124, 100, 30); /* oklch */ color: oklch(51.4% 0.091 89.3);
Tailwind
colors: {
custom: {
50: '#a58f5f',
500: '#7c641e',
950: '#000000',
},
}SCSS
$custom: #7c641e; $custom-light: #a58f5f; $custom-dark: #000000;
JSON
{
"hex": "#7c641e",
"rgb": {
"r": 124,
"g": 100,
"b": 30
},
"hsl": {
"h": 44.681,
"s": 61.039,
"l": 30.196
},
"oklch": {
"l": 0.51364,
"c": 0.09138,
"h": 89.3
},
"luminance": 0.13493
}Semantic roles & 50–950 ramp
primary
#7C641E
secondary
#4661AF
accent
#6DE444
background
#FAF8F5
surface
#F4F0E9
border
#CECBC5
text
#100C05
muted
#7F7D79