#F66697#F66697
#F66697 is a light, vivid pink. Relative luminance 0.313; OKLCH L 70.3% C 0.182 H 1.7°. Best body text is #000000 at 7.27:1 contrast (WCAG AA passes).
Color values
| HEX | #F66697 |
|---|---|
| RGB | rgb(246, 102, 151) |
| HSL | hsl(340, 89%, 68%) |
| HSV | hsv(340, 59%, 96%) |
| CMYK | cmyk(0%, 58.5%, 38.6%, 3.5%) |
| CIE-LAB | lab(62.79, 59.52, 1.81) |
| CIE-LCH | lch(62.79, 59.54, 1.74°) |
| OKLab | oklab(70.28% 0.1815 0.0054) |
| OKLCH | oklch(70.28% 0.182 1.7) |
| XYZ | xyz(48.3463, 31.3352, 32.7744) |
| Luminance | 0.3133 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Closest named colors
Medium Pink
#F36196
ΔE00 1.31
Strawberry
#FC5A8D
ΔE00 2.58
Rosy Pink
#F6688E
ΔE00 2.62
Palevioletred
#DB7093
ΔE00 4.62
Bubble Gum Pink
#FF69AF
ΔE00 4.91
Warm Pink
#FB5581
ΔE00 4.93
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#F66697 #66F6C5
analogous
#F666DF #F66697 #F67D66
triadic
#F66697 #97F666 #6697F6
tetradic
#F66697 #DFF666 #66F6C5 #7D66F6
square
#F66697 #DFF666 #66F6C5 #7D66F6
split-complementary
#F66697 #66F67D #66DFF6
monochromatic
#D50D51 #F32C70 #F66697 #F9A0BE #FDDAE6
Accessibility & contrast
On white
2.89
#F66697 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
7.27
#F66697 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #F66697
7.27:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##F66697 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##F66697 | 1.00 | 2.89 | 7.27 | 7.27 |
| #FFFFFF | 2.89 | 1.00 | 21.00 | 21.00 |
| #000000 | 7.27 | 21.00 | 1.00 | 1.00 |
| ##000000 | 7.27 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#808798
Deuteranopia (green-blind)
#A6A294
Tritanopia (blue-blind)
#FF5879
Achromatopsia (no color)
#989898
Design tokens & code
CSS
--color: #f66697; /* rgb */ color: rgb(246, 102, 151); /* oklch */ color: oklch(70.3% 0.182 1.7);
Tailwind
colors: {
custom: {
50: '#fe98b5',
500: '#f66697',
950: '#000000',
},
}SCSS
$custom: #f66697; $custom-light: #fe98b5; $custom-dark: #000000;
JSON
{
"hex": "#f66697",
"rgb": {
"r": 246,
"g": 102,
"b": 151
},
"hsl": {
"h": 339.583,
"s": 88.889,
"l": 68.235
},
"oklch": {
"l": 0.70276,
"c": 0.18162,
"h": 1.7
},
"luminance": 0.3133
}Semantic roles & 50–950 ramp
primary
#F66697
secondary
#C6F2E3
accent
#E69700
background
#FFF9FB
surface
#FFF2F6
border
#D7CCD0
text
#180E11
muted
#867E80