#BA5173#BA5173
#BA5173 is a mid, vivid pink. Relative luminance 0.176; OKLCH L 57.8% C 0.139 H 2.1°. Best body text is #FFFFFF at 4.65:1 contrast (WCAG AA passes).
Color values
| HEX | #BA5173 |
|---|---|
| RGB | rgb(186, 81, 115) |
| HSL | hsl(341, 43%, 52%) |
| HSV | hsv(341, 56%, 73%) |
| CMYK | cmyk(0%, 56.5%, 38.2%, 27.1%) |
| CIE-LAB | lab(48.96, 45.75, 1.79) |
| CIE-LCH | lch(48.96, 45.79, 2.24°) |
| OKLab | oklab(57.81% 0.1394 0.0052) |
| OKLCH | oklch(57.81% 0.139 2.1) |
| XYZ | xyz(26.2881, 17.5645, 18.2222) |
| Luminance | 0.1756 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Closest named colors
Dark Pink
#CB416B
ΔE00 4.19
Deep Rose
#C74767
ΔE00 4.38
Dark Rose
#B5485D
ΔE00 5.69
Darkish Pink
#DA467D
ΔE00 5.96
Light Burgundy
#A8415B
ΔE00 6.76
Dusky Rose
#BA6873
ΔE00 7.64
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#BA5173 #51BA98
analogous
#BA51A8 #BA5173 #BA6351
triadic
#BA5173 #73BA51 #5173BA
tetradic
#BA5173 #A8BA51 #51BA98 #6351BA
square
#BA5173 #A8BA51 #51BA98 #6351BA
split-complementary
#BA5173 #51BA63 #51A8BA
monochromatic
#68293D #933A57 #BA5173 #CB7D96 #DDA9BA
Accessibility & contrast
On white
4.65
#BA5173 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.51
#BA5173 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#FFFFFF on #BA5173
4.65:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##BA5173 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##BA5173 | 1.00 | 4.65 | 4.51 | 4.65 |
| #FFFFFF | 4.65 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.51 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.65 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#646874
Deuteranopia (green-blind)
#7F7C71
Tritanopia (blue-blind)
#C8475E
Achromatopsia (no color)
#747474
Design tokens & code
CSS
--color: #ba5173; /* rgb */ color: rgb(186, 81, 115); /* oklch */ color: oklch(57.8% 0.139 2.1);
Tailwind
colors: {
custom: {
50: '#d2869b',
500: '#ba5173',
950: '#000000',
},
}SCSS
$custom: #ba5173; $custom-light: #d2869b; $custom-dark: #000000;
JSON
{
"hex": "#ba5173",
"rgb": {
"r": 186,
"g": 81,
"b": 115
},
"hsl": {
"h": 340.571,
"s": 43.21,
"l": 52.353
},
"oklch": {
"l": 0.57806,
"c": 0.13948,
"h": 2.1
},
"luminance": 0.17562
}Semantic roles & 50–950 ramp
primary
#BA5173
secondary
#9DCABB
accent
#D3AA55
background
#FDF8F9
surface
#FAF0F2
border
#D3CBCC
text
#150B0E
muted
#837C7E