#64241E#64241E
#64241E is a dark, moderate red. Relative luminance 0.041; OKLCH L 35.5% C 0.094 H 28.1°. Best body text is #FFFFFF at 11.58:1 contrast (WCAG AA passes).
Color values
| HEX | #64241E |
|---|---|
| RGB | rgb(100, 36, 30) |
| HSL | hsl(5, 54%, 25%) |
| HSV | hsv(5, 70%, 39%) |
| CMYK | cmyk(0%, 64%, 70%, 60.8%) |
| CIE-LAB | lab(23.89, 28.49, 18.88) |
| CIE-LCH | lch(23.89, 34.18, 33.53°) |
| OKLab | oklab(35.47% 0.083 0.0443) |
| OKLCH | oklch(35.47% 0.094 28.1) |
| XYZ | xyz(6.1213, 4.0656, 1.6904) |
| Luminance | 0.0406 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Rosewood
#65000B
ΔE00 5.94
Reddy Brown
#6E1005
ΔE00 6.31
Claret
#680018
ΔE00 6.77
Wine
#722F37
ΔE00 7.46
Dried Blood
#4B0101
ΔE00 7.82
Blood
#770001
ΔE00 7.85
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#64241E #1E5E64
analogous
#641E3B #64241E #64471E
triadic
#64241E #1E6424 #241E64
tetradic
#64241E #3B641E #1E5E64 #471E64
square
#64241E #3B641E #1E5E64 #471E64
split-complementary
#64241E #1E6447 #1E3B64
monochromatic
#180807 #351310 #64241E #93352C #C2463A
Accessibility & contrast
On white
11.58
#64241E on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.81
#64241E on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #64241E
11.58:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##64241E | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##64241E | 1.00 | 11.58 | 1.81 | 11.58 |
| #FFFFFF | 11.58 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.81 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 11.58 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#35301D
Deuteranopia (green-blind)
#453E1C
Tritanopia (blue-blind)
#6E1723
Achromatopsia (no color)
#393939
Design tokens & code
CSS
--color: #64241e; /* rgb */ color: rgb(100, 36, 30); /* oklch */ color: oklch(35.5% 0.094 28.1);
Tailwind
colors: {
custom: {
50: '#95625a',
500: '#64241e',
950: '#000000',
},
}SCSS
$custom: #64241e; $custom-light: #95625a; $custom-dark: #000000;
JSON
{
"hex": "#64241e",
"rgb": {
"r": 100,
"g": 36,
"b": 30
},
"hsl": {
"h": 5.143,
"s": 53.846,
"l": 25.49
},
"oklch": {
"l": 0.35474,
"c": 0.09407,
"h": 28.1
},
"luminance": 0.04065
}Semantic roles & 50–950 ramp
primary
#64241E
secondary
#459299
accent
#D1DD4B
background
#F9F5F5
surface
#F2EAE9
border
#CCC6C5
text
#0E0503
muted
#7E7978