#F97FD1#F97FD1
#F97FD1 is a light, vivid pink. Relative luminance 0.399; OKLCH L 75.9% C 0.176 H 341.3°. Best body text is #000000 at 8.98:1 contrast (WCAG AA passes).
Color values
| HEX | #F97FD1 |
|---|---|
| RGB | rgb(249, 127, 209) |
| HSL | hsl(320, 91%, 74%) |
| HSV | hsv(320, 49%, 98%) |
| CMYK | cmyk(0%, 49%, 16.1%, 2.4%) |
| CIE-LAB | lab(69.42, 56.33, -21.09) |
| CIE-LCH | lch(69.42, 60.14, 339.47°) |
| OKLab | oklab(75.91% 0.1664 -0.0563) |
| OKLCH | oklch(75.91% 0.176 341.3) |
| XYZ | xyz(58.1658, 39.9262, 64.9522) |
| Luminance | 0.3992 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Closest named colors
Bubblegum Pink
#FE83CC
ΔE00 2.16
Pink (survey)
#FF81C0
ΔE00 4.46
Lavender Pink
#DD85D7
ΔE00 5.58
Purply Pink
#F075E6
ΔE00 5.87
Bubblegum (survey)
#FF6CB5
ΔE00 5.88
Hot Pink
#FF69B4
ΔE00 6.16
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#F97FD1 #7FF9A7
analogous
#E47FF9 #F97FD1 #F97F94
triadic
#F97FD1 #D1F97F #7FD1F9
tetradic
#F97FD1 #F9E47F #7FF9A7 #7F94F9
square
#F97FD1 #F9E47F #7FF9A7 #7F94F9
split-complementary
#F97FD1 #94F97F #7FF9E4
monochromatic
#F20BA7 #F645BC #F97FD1 #FCB9E6 #FEE2F4
Accessibility & contrast
On white
2.34
#F97FD1 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
8.98
#F97FD1 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #F97FD1
8.98:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##F97FD1 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##F97FD1 | 1.00 | 2.34 | 8.98 | 8.98 |
| #FFFFFF | 2.34 | 1.00 | 21.00 | 21.00 |
| #000000 | 8.98 | 21.00 | 1.00 | 1.00 |
| ##000000 | 8.98 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#869DD4
Deuteranopia (green-blind)
#A7B1CE
Tritanopia (blue-blind)
#FF809F
Achromatopsia (no color)
#A9A9A9
Design tokens & code
CSS
--color: #f97fd1; /* rgb */ color: rgb(249, 127, 209); /* oklch */ color: oklch(75.9% 0.176 341.3);
Tailwind
colors: {
custom: {
50: '#fea8df',
500: '#f97fd1',
950: '#000000',
},
}SCSS
$custom: #f97fd1; $custom-light: #fea8df; $custom-dark: #000000;
JSON
{
"hex": "#f97fd1",
"rgb": {
"r": 249,
"g": 127,
"b": 209
},
"hsl": {
"h": 319.672,
"s": 91.045,
"l": 73.725
},
"oklch": {
"l": 0.75908,
"c": 0.17565,
"h": 341.3
},
"luminance": 0.39922
}Semantic roles & 50–950 ramp
primary
#F97FD1
secondary
#D5F6E0
accent
#E64B00
background
#FFFAFD
surface
#FFF4FB
border
#D7CED4
text
#181015
muted
#867F83