#842057#842057
#842057 is a dark, vivid pink. Relative luminance 0.066; OKLCH L 42.4% C 0.145 H 351.5°. Best body text is #FFFFFF at 9.03:1 contrast (WCAG AA passes).
Color values
| HEX | #842057 |
|---|---|
| RGB | rgb(132, 32, 87) |
| HSL | hsl(327, 61%, 32%) |
| HSV | hsv(327, 76%, 52%) |
| CMYK | cmyk(0%, 75.8%, 34.1%, 48.2%) |
| CIE-LAB | lab(30.94, 46.75, -8.31) |
| CIE-LCH | lch(30.94, 47.49, 349.92°) |
| OKLab | oklab(42.38% 0.1431 -0.0215) |
| OKLCH | oklch(42.38% 0.145 351.5) |
| XYZ | xyz(11.7532, 6.6281, 9.6754) |
| Luminance | 0.0663 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Closest named colors
Reddish Purple
#910951
ΔE00 3.65
Dark Magenta
#960056
ΔE00 3.92
Red Purple
#820747
ΔE00 4.05
Mulberry
#920A4E
ΔE00 4.43
Velvet
#750851
ΔE00 4.74
Dark Fuchsia
#9D0759
ΔE00 4.94
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#842057 #20844D
analogous
#7F2084 #842057 #842025
triadic
#842057 #578420 #205784
tetradic
#842057 #847F20 #20844D #202584
square
#842057 #847F20 #20844D #202584
split-complementary
#842057 #258420 #20847F
monochromatic
#210816 #531437 #842057 #B52C77 #D34B96
Accessibility & contrast
On white
9.03
#842057 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.33
#842057 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #842057
9.03:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##842057 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##842057 | 1.00 | 9.03 | 2.33 | 9.03 |
| #FFFFFF | 9.03 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.33 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 9.03 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#313D58
Deuteranopia (green-blind)
#4E4F55
Tritanopia (blue-blind)
#8E1838
Achromatopsia (no color)
#494949
Design tokens & code
CSS
--color: #842057; /* rgb */ color: rgb(132, 32, 87); /* oklch */ color: oklch(42.4% 0.145 351.5);
Tailwind
colors: {
custom: {
50: '#ac6586',
500: '#842057',
950: '#000000',
},
}SCSS
$custom: #842057; $custom-light: #ac6586; $custom-dark: #000000;
JSON
{
"hex": "#842057",
"rgb": {
"r": 132,
"g": 32,
"b": 87
},
"hsl": {
"h": 327,
"s": 60.976,
"l": 32.157
},
"oklch": {
"l": 0.42381,
"c": 0.14469,
"h": 351.5
},
"luminance": 0.06627
}Semantic roles & 50–950 ramp
primary
#842057
secondary
#4AB67A
accent
#E48C44
background
#FBF6F8
surface
#F6EBEF
border
#D0C6CA
text
#11060B
muted
#807A7C