#8F326A#8F326A
#8F326A is a mid, vivid pink. Relative luminance 0.092; OKLCH L 46.9% C 0.140 H 346.7°. Best body text is #FFFFFF at 7.41:1 contrast (WCAG AA passes).
Color values
| HEX | #8F326A |
|---|---|
| RGB | rgb(143, 50, 106) |
| HSL | hsl(324, 48%, 38%) |
| HSV | hsv(324, 65%, 56%) |
| CMYK | cmyk(0%, 65%, 25.9%, 43.9%) |
| CIE-LAB | lab(36.30, 45.21, -12.22) |
| CIE-LCH | lch(36.30, 46.83, 344.87°) |
| OKLab | oklab(46.93% 0.1366 -0.0322) |
| OKLCH | oklch(46.93% 0.14 346.7) |
| XYZ | xyz(15.0704, 9.1629, 14.6078) |
| Luminance | 0.0916 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Closest named colors
Red Violet
#9E0168
ΔE00 5.02
Bruise
#7E4071
ΔE00 5.24
Deep Magenta
#A0025C
ΔE00 6.09
Dark Fuchsia
#9D0759
ΔE00 6.19
Dark Magenta
#960056
ΔE00 6.36
Reddish Purple
#910951
ΔE00 6.80
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#8F326A #328F57
analogous
#85328F #8F326A #8F323B
triadic
#8F326A #6A8F32 #326A8F
tetradic
#8F326A #8F8532 #328F57 #323B8F
square
#8F326A #8F8532 #328F57 #323B8F
split-complementary
#8F326A #3B8F32 #328F85
monochromatic
#341227 #622248 #8F326A #BC428C #CD6FA7
Accessibility & contrast
On white
7.41
#8F326A on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.83
#8F326A on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #8F326A
7.41:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##8F326A | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##8F326A | 1.00 | 7.41 | 2.83 | 7.41 |
| #FFFFFF | 7.41 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.83 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 7.41 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#3C4B6C
Deuteranopia (green-blind)
#575B68
Tritanopia (blue-blind)
#993049
Achromatopsia (no color)
#555555
Design tokens & code
CSS
--color: #8f326a; /* rgb */ color: rgb(143, 50, 106); /* oklch */ color: oklch(46.9% 0.140 346.7);
Tailwind
colors: {
custom: {
50: '#b37094',
500: '#8f326a',
950: '#000000',
},
}SCSS
$custom: #8f326a; $custom-light: #b37094; $custom-dark: #000000;
JSON
{
"hex": "#8f326a",
"rgb": {
"r": 143,
"g": 50,
"b": 106
},
"hsl": {
"h": 323.871,
"s": 48.187,
"l": 37.843
},
"oklch": {
"l": 0.46928,
"c": 0.14034,
"h": 346.7
},
"luminance": 0.09161
}Semantic roles & 50–950 ramp
primary
#8F326A
secondary
#68B487
accent
#D88650
background
#FBF7F9
surface
#F6EDF1
border
#D0C8CB
text
#11080D
muted
#807B7E