#96333D#96333D
#96333D is a mid, vivid red. Relative luminance 0.092; OKLCH L 46.8% C 0.132 H 18.0°. Best body text is #FFFFFF at 7.40:1 contrast (WCAG AA passes).
Color values
| HEX | #96333D |
|---|---|
| RGB | rgb(150, 51, 61) |
| HSL | hsl(354, 49%, 39%) |
| HSV | hsv(354, 66%, 59%) |
| CMYK | cmyk(0%, 66%, 59.3%, 41.2%) |
| CIE-LAB | lab(36.35, 42.17, 16.69) |
| CIE-LCH | lch(36.35, 45.35, 21.59°) |
| OKLab | oklab(46.76% 0.126 0.041) |
| OKLCH | oklch(46.76% 0.132 18) |
| XYZ | xyz(14.6052, 9.1906, 5.4188) |
| Luminance | 0.0919 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Rouge
#AB1239
ΔE00 5.04
Cranberry
#9E003A
ΔE00 6.29
Brown
#A52A2A
ΔE00 6.71
Light Maroon
#A24857
ΔE00 6.88
Rose Red
#BE013C
ΔE00 7.57
Red Wine
#8C0034
ΔE00 7.76
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#96333D #33968C
analogous
#96336F #96333D #965A33
triadic
#96333D #3D9633 #333D96
tetradic
#96333D #6F9633 #33968C #5A3396
square
#96333D #6F9633 #33968C #5A3396
split-complementary
#96333D #33965A #336F96
monochromatic
#3B1418 #68232A #96333D #C04652 #D0747D
Accessibility & contrast
On white
7.40
#96333D on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.84
#96333D on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #96333D
7.40:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##96333D | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##96333D | 1.00 | 7.40 | 2.84 | 7.40 |
| #FFFFFF | 7.40 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.84 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 7.40 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#4C483D
Deuteranopia (green-blind)
#655D3B
Tritanopia (blue-blind)
#A41F37
Achromatopsia (no color)
#555555
Design tokens & code
CSS
--color: #96333d; /* rgb */ color: rgb(150, 51, 61); /* oklch */ color: oklch(46.8% 0.132 18.0);
Tailwind
colors: {
custom: {
50: '#ba7072',
500: '#96333d',
950: '#000000',
},
}SCSS
$custom: #96333d; $custom-light: #ba7072; $custom-dark: #000000;
JSON
{
"hex": "#96333d",
"rgb": {
"r": 150,
"g": 51,
"b": 61
},
"hsl": {
"h": 353.939,
"s": 49.254,
"l": 39.412
},
"oklch": {
"l": 0.46764,
"c": 0.13249,
"h": 18
},
"luminance": 0.09189
}Semantic roles & 50–950 ramp
primary
#96333D
secondary
#6DB8B0
accent
#D9CB4F
background
#FCF7F6
surface
#F8EDEC
border
#D1C8C7
text
#130808
muted
#827B7B