#5A2145#5A2145
#5A2145 is a dark, moderate pink. Relative luminance 0.037; OKLCH L 34.5% C 0.096 H 344.4°. Best body text is #FFFFFF at 12.08:1 contrast (WCAG AA passes).
Color values
| HEX | #5A2145 |
|---|---|
| RGB | rgb(90, 33, 69) |
| HSL | hsl(322, 46%, 24%) |
| HSV | hsv(322, 63%, 35%) |
| CMYK | cmyk(0%, 63.3%, 23.3%, 64.7%) |
| CIE-LAB | lab(22.62, 30.76, -9.66) |
| CIE-LCH | lch(22.62, 32.24, 342.57°) |
| OKLab | oklab(34.55% 0.0922 -0.0256) |
| OKLCH | oklch(34.55% 0.096 344.4) |
| XYZ | xyz(5.8347, 3.6916, 6.0343) |
| Luminance | 0.0369 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Closest named colors
Plum (survey)
#580F41
ΔE00 3.63
Grape Purple
#5D1451
ΔE00 5.35
Velvet
#750851
ΔE00 6.72
Grape
#6C3461
ΔE00 6.80
Rich Purple
#720058
ΔE00 7.61
Aubergine
#3D0734
ΔE00 7.75
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#5A2145 #215A36
analogous
#53215A #5A2145 #5A2129
triadic
#5A2145 #455A21 #21455A
tetradic
#5A2145 #5A5321 #215A36 #21295A
square
#5A2145 #5A5321 #215A36 #21295A
split-complementary
#5A2145 #295A21 #215A53
monochromatic
#160811 #2D1123 #5A2145 #873167 #B4428A
Accessibility & contrast
On white
12.08
#5A2145 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.74
#5A2145 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #5A2145
12.08:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##5A2145 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##5A2145 | 1.00 | 12.08 | 1.74 | 12.08 |
| #FFFFFF | 12.08 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.74 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 12.08 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#263046
Deuteranopia (green-blind)
#363A44
Tritanopia (blue-blind)
#602130
Achromatopsia (no color)
#363636
Design tokens & code
CSS
--color: #5a2145; /* rgb */ color: rgb(90, 33, 69); /* oklch */ color: oklch(34.5% 0.096 344.4);
Tailwind
colors: {
custom: {
50: '#8b6078',
500: '#5a2145',
950: '#000000',
},
}SCSS
$custom: #5a2145; $custom-light: #8b6078; $custom-dark: #000000;
JSON
{
"hex": "#5a2145",
"rgb": {
"r": 90,
"g": 33,
"b": 69
},
"hsl": {
"h": 322.105,
"s": 46.341,
"l": 24.118
},
"oklch": {
"l": 0.34549,
"c": 0.09567,
"h": 344.4
},
"luminance": 0.03691
}Semantic roles & 50–950 ramp
primary
#5A2145
secondary
#498E62
accent
#D68352
background
#F8F5F7
surface
#F0E9ED
border
#CBC5C8
text
#0C0509
muted
#7D797B