#3E323C#3E323C
#3E323C is a dark, muted pink. Relative luminance 0.036; OKLCH L 33.4% C 0.024 H 331.8°. Best body text is #FFFFFF at 12.16:1 contrast (WCAG AA passes).
Color values
| HEX | #3E323C |
|---|---|
| RGB | rgb(62, 50, 60) |
| HSL | hsl(310, 11%, 22%) |
| HSV | hsv(310, 19%, 24%) |
| CMYK | cmyk(0%, 19.4%, 3.2%, 75.7%) |
| CIE-LAB | lab(22.41, 7.50, -4.26) |
| CIE-LCH | lch(22.41, 8.63, 330.42°) |
| OKLab | oklab(33.4% 0.0211 -0.0113) |
| OKLCH | oklch(33.4% 0.024 331.8) |
| XYZ | xyz(3.9427, 3.6317, 4.7674) |
| Luminance | 0.0363 (WCAG relative) |
| Temperature | neutral |
| Family | pink |
Closest named colors
Dark Grey
#363737
ΔE00 10.13
Onyx
#353839
ΔE00 11.09
Charcoal (survey)
#343837
ΔE00 12.38
Dark
#1B2431
ΔE00 12.53
Charcoal Grey
#3C4142
ΔE00 12.74
Purple Brown
#673A3F
ΔE00 13.19
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#3E323C #323E34
analogous
#3A323E #3E323C #3E3236
triadic
#3E323C #3C3E32 #323C3E
tetradic
#3E323C #3E3A32 #323E34 #32363E
square
#3E323C #3E3A32 #323E34 #32363E
split-complementary
#3E323C #363E32 #323E3A
monochromatic
#110E10 #1C171B #3E323C #604D5D #82697E
Accessibility & contrast
On white
12.16
#3E323C on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.73
#3E323C on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #3E323C
12.16:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##3E323C | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##3E323C | 1.00 | 12.16 | 1.73 | 12.16 |
| #FFFFFF | 12.16 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.73 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 12.16 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#32353C
Deuteranopia (green-blind)
#34363C
Tritanopia (blue-blind)
#3F3335
Achromatopsia (no color)
#363636
Design tokens & code
CSS
--color: #3e323c; /* rgb */ color: rgb(62, 50, 60); /* oklch */ color: oklch(33.4% 0.024 331.8);
Tailwind
colors: {
custom: {
50: '#736971',
500: '#3e323c',
950: '#000000',
},
}SCSS
$custom: #3e323c; $custom-light: #736971; $custom-dark: #000000;
JSON
{
"hex": "#3e323c",
"rgb": {
"r": 62,
"g": 50,
"b": 60
},
"hsl": {
"h": 310,
"s": 10.714,
"l": 21.961
},
"oklch": {
"l": 0.33404,
"c": 0.02395,
"h": 331.8
},
"luminance": 0.03632
}Semantic roles & 50–950 ramp
primary
#3E323C
secondary
#5E6E61
accent
#B47F74
background
#F6F6F6
surface
#ECEBEC
border
#C7C6C7
text
#080607
muted
#7B7A7A