#AF519B#AF519B
#AF519B is a mid, vivid pink. Relative luminance 0.174; OKLCH L 57.8% C 0.152 H 336.2°. Best body text is #FFFFFF at 4.69:1 contrast (WCAG AA passes).
Color values
| HEX | #AF519B |
|---|---|
| RGB | rgb(175, 81, 155) |
| HSL | hsl(313, 37%, 50%) |
| HSV | hsv(313, 54%, 69%) |
| CMYK | cmyk(0%, 53.7%, 11.4%, 31.4%) |
| CIE-LAB | lab(48.72, 47.84, -22.70) |
| CIE-LCH | lch(48.72, 52.95, 334.61°) |
| OKLab | oklab(57.75% 0.1392 -0.0614) |
| OKLCH | oklch(57.75% 0.152 336.2) |
| XYZ | xyz(26.5382, 17.3673, 32.9585) |
| Luminance | 0.1736 (WCAG relative) |
| Temperature | neutral |
| Family | pink |
Closest named colors
Purpleish
#98568D
ΔE00 5.03
Ugly Purple
#A442A0
ΔE00 5.39
Purplish
#94568C
ΔE00 5.81
Light Plum
#9D5783
ΔE00 6.28
Medium Purple
#9E43A2
ΔE00 6.51
Purpley Pink
#C83CB9
ΔE00 6.72
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#AF519B #51AF65
analogous
#9451AF #AF519B #AF516C
triadic
#AF519B #9BAF51 #519BAF
tetradic
#AF519B #AF9451 #51AF65 #516CAF
square
#AF519B #AF9451 #51AF65 #516CAF
split-complementary
#AF519B #6CAF51 #51AF94
monochromatic
#5C2A51 #853D76 #AF519B #C27BB3 #D6A5CB
Accessibility & contrast
On white
4.69
#AF519B on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.47
#AF519B on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #AF519B
4.69:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##AF519B | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##AF519B | 1.00 | 4.69 | 4.47 | 4.69 |
| #FFFFFF | 4.69 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.47 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.69 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#526B9D
Deuteranopia (green-blind)
#6D7998
Tritanopia (blue-blind)
#B7556F
Achromatopsia (no color)
#747474
Design tokens & code
CSS
--color: #af519b; /* rgb */ color: rgb(175, 81, 155); /* oklch */ color: oklch(57.8% 0.152 336.2);
Tailwind
colors: {
custom: {
50: '#c986b8',
500: '#af519b',
950: '#000000',
},
}SCSS
$custom: #af519b; $custom-light: #c986b8; $custom-dark: #000000;
JSON
{
"hex": "#af519b",
"rgb": {
"r": 175,
"g": 81,
"b": 155
},
"hsl": {
"h": 312.766,
"s": 37.008,
"l": 50.196
},
"oklch": {
"l": 0.57754,
"c": 0.15214,
"h": 336.2
},
"luminance": 0.17365
}Semantic roles & 50–950 ramp
primary
#AF519B
secondary
#99C3A2
accent
#CD735B
background
#FCF8FB
surface
#F9F0F6
border
#D2CBD0
text
#130B11
muted
#827C80