#FA5A83#FA5A83
#FA5A83 is a light, vivid pink. Relative luminance 0.293; OKLCH L 68.9% C 0.196 H 8.3°. Best body text is #000000 at 6.86:1 contrast (WCAG AA passes).
Color values
| HEX | #FA5A83 |
|---|---|
| RGB | rgb(250, 90, 131) |
| HSL | hsl(345, 94%, 67%) |
| HSV | hsv(345, 64%, 98%) |
| CMYK | cmyk(0%, 64%, 47.6%, 2%) |
| CIE-LAB | lab(61.03, 63.87, 10.94) |
| CIE-LCH | lch(61.03, 64.80, 9.72°) |
| OKLab | oklab(68.92% 0.1942 0.0284) |
| OKLCH | oklch(68.92% 0.196 8.3) |
| XYZ | xyz(47.1810, 29.2809, 24.6356) |
| Luminance | 0.2928 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Closest named colors
Warm Pink
#FB5581
ΔE00 0.75
Strawberry
#FC5A8D
ΔE00 2.42
Rosy Pink
#F6688E
ΔE00 2.75
Watermelon
#FC6C85
ΔE00 3.95
Medium Pink
#F36196
ΔE00 4.84
Blush
#DE5D83
ΔE00 5.16
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#FA5A83 #5AFAD1
analogous
#FA5AD3 #FA5A83 #FA815A
triadic
#FA5A83 #83FA5A #5A83FA
tetradic
#FA5A83 #D3FA5A #5AFAD1 #815AFA
square
#FA5A83 #D3FA5A #5AFAD1 #815AFA
split-complementary
#FA5A83 #5AFA81 #5AD3FA
monochromatic
#D3063B #F81F56 #FA5A83 #FC95B0 #FED1DC
Accessibility & contrast
On white
3.06
#FA5A83 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
6.86
#FA5A83 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #FA5A83
6.86:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##FA5A83 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##FA5A83 | 1.00 | 3.06 | 6.86 | 6.86 |
| #FFFFFF | 3.06 | 1.00 | 21.00 | 21.00 |
| #000000 | 6.86 | 21.00 | 1.00 | 1.00 |
| ##000000 | 6.86 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#7D7F84
Deuteranopia (green-blind)
#A79F7F
Tritanopia (blue-blind)
#FF426A
Achromatopsia (no color)
#939393
Design tokens & code
CSS
--color: #fa5a83; /* rgb */ color: rgb(250, 90, 131); /* oklch */ color: oklch(68.9% 0.196 8.3);
Tailwind
colors: {
custom: {
50: '#ff91a6',
500: '#fa5a83',
950: '#000000',
},
}SCSS
$custom: #fa5a83; $custom-light: #ff91a6; $custom-dark: #000000;
JSON
{
"hex": "#fa5a83",
"rgb": {
"r": 250,
"g": 90,
"b": 131
},
"hsl": {
"h": 344.625,
"s": 94.118,
"l": 66.667
},
"oklch": {
"l": 0.68917,
"c": 0.19628,
"h": 8.3
},
"luminance": 0.29275
}Semantic roles & 50–950 ramp
primary
#FA5A83
secondary
#BEF2E4
accent
#E6AB00
background
#FFF9FA
surface
#FFF2F4
border
#D7CCCE
text
#190D0F
muted
#877E7F