#FC77C2#FC77C2
#FC77C2 is a light, vivid pink. Relative luminance 0.378; OKLCH L 74.7% C 0.181 H 347.4°. Best body text is #000000 at 8.56:1 contrast (WCAG AA passes).
Color values
| HEX | #FC77C2 |
|---|---|
| RGB | rgb(252, 119, 194) |
| HSL | hsl(326, 96%, 73%) |
| HSV | hsv(326, 53%, 99%) |
| CMYK | cmyk(0%, 52.8%, 23%, 1.2%) |
| CIE-LAB | lab(67.86, 58.88, -15.02) |
| CIE-LCH | lch(67.86, 60.76, 345.69°) |
| OKLab | oklab(74.66% 0.1769 -0.0395) |
| OKLCH | oklch(74.66% 0.181 347.4) |
| XYZ | xyz(56.4810, 37.7890, 55.3478) |
| Luminance | 0.3778 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Closest named colors
Bubblegum Pink
#FE83CC
ΔE00 2.54
Pink (survey)
#FF81C0
ΔE00 2.63
Bubblegum (survey)
#FF6CB5
ΔE00 2.85
Hot Pink
#FF69B4
ΔE00 3.19
Bubble Gum Pink
#FF69AF
ΔE00 3.98
Pale Magenta
#D767AD
ΔE00 7.68
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#FC77C2 #77FCB1
analogous
#F377FC #FC77C2 #FC7780
triadic
#FC77C2 #C2FC77 #77C2FC
tetradic
#FC77C2 #FCF377 #77FCB1 #7780FC
square
#FC77C2 #FCF377 #77FCB1 #7780FC
split-complementary
#FC77C2 #80FC77 #77FCF3
monochromatic
#F3058C #FB3BA7 #FC77C2 #FDB3DD #FEE1F2
Accessibility & contrast
On white
2.45
#FC77C2 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
8.56
#FC77C2 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #FC77C2
8.56:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##FC77C2 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##FC77C2 | 1.00 | 2.45 | 8.56 | 8.56 |
| #FFFFFF | 2.45 | 1.00 | 21.00 | 21.00 |
| #000000 | 8.56 | 21.00 | 1.00 | 1.00 |
| ##000000 | 8.56 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#8497C4
Deuteranopia (green-blind)
#A8AEBF
Tritanopia (blue-blind)
#FF7494
Achromatopsia (no color)
#A5A5A5
Design tokens & code
CSS
--color: #fc77c2; /* rgb */ color: rgb(252, 119, 194); /* oklch */ color: oklch(74.7% 0.181 347.4);
Tailwind
colors: {
custom: {
50: '#ffa3d4',
500: '#fc77c2',
950: '#000000',
},
}SCSS
$custom: #fc77c2; $custom-light: #ffa3d4; $custom-dark: #000000;
JSON
{
"hex": "#fc77c2",
"rgb": {
"r": 252,
"g": 119,
"b": 194
},
"hsl": {
"h": 326.165,
"s": 95.683,
"l": 72.745
},
"oklch": {
"l": 0.74664,
"c": 0.18125,
"h": 347.4
},
"luminance": 0.37784
}Semantic roles & 50–950 ramp
primary
#FC77C2
secondary
#D4F7E3
accent
#E66400
background
#FFFAFD
surface
#FFF4FA
border
#D7CED3
text
#180F14
muted
#867F83