#CA66A2#CA66A2
#CA66A2 is a light, vivid pink. Relative luminance 0.247; OKLCH L 64.6% C 0.145 H 345.0°. Best body text is #000000 at 5.93:1 contrast (WCAG AA passes).
Color values
| HEX | #CA66A2 |
|---|---|
| RGB | rgb(202, 102, 162) |
| HSL | hsl(324, 49%, 60%) |
| HSV | hsv(324, 50%, 79%) |
| CMYK | cmyk(0%, 49.5%, 19.8%, 20.8%) |
| CIE-LAB | lab(56.75, 46.93, -14.21) |
| CIE-LCH | lch(56.75, 49.03, 343.16°) |
| OKLab | oklab(64.6% 0.1399 -0.0376) |
| OKLCH | oklch(64.6% 0.145 345) |
| XYZ | xyz(35.6308, 24.6707, 37.0607) |
| Luminance | 0.2467 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Closest named colors
Pale Magenta
#D767AD
ΔE00 2.79
Purplish Pink
#CE5DAE
ΔE00 3.69
Orchid (survey)
#C875C4
ΔE00 7.50
Palevioletred
#DB7093
ΔE00 7.95
Purpleish Pink
#DF4EC8
ΔE00 8.73
Barbie Pink
#FE46A5
ΔE00 8.74
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#CA66A2 #66CA8E
analogous
#C066CA #CA66A2 #CA6670
triadic
#CA66A2 #A2CA66 #66A2CA
tetradic
#CA66A2 #CAC066 #66CA8E #6670CA
square
#CA66A2 #CAC066 #66CA8E #6670CA
split-complementary
#CA66A2 #70CA66 #66CAC0
monochromatic
#872F64 #B43E85 #CA66A2 #DA93BE #E9C1D9
Accessibility & contrast
On white
3.54
#CA66A2 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.93
#CA66A2 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #CA66A2
5.93:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##CA66A2 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##CA66A2 | 1.00 | 3.54 | 5.93 | 5.93 |
| #FFFFFF | 3.54 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.93 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.93 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#6E7EA4
Deuteranopia (green-blind)
#898E9F
Tritanopia (blue-blind)
#D5657D
Achromatopsia (no color)
#888888
Design tokens & code
CSS
--color: #ca66a2; /* rgb */ color: rgb(202, 102, 162); /* oklch */ color: oklch(64.6% 0.145 345.0);
Tailwind
colors: {
custom: {
50: '#dc95bd',
500: '#ca66a2',
950: '#000000',
},
}SCSS
$custom: #ca66a2; $custom-light: #dc95bd; $custom-dark: #000000;
JSON
{
"hex": "#ca66a2",
"rgb": {
"r": 202,
"g": 102,
"b": 162
},
"hsl": {
"h": 324,
"s": 48.544,
"l": 59.608
},
"oklch": {
"l": 0.64601,
"c": 0.14485,
"h": 345
},
"luminance": 0.24668
}Semantic roles & 50–950 ramp
primary
#CA66A2
secondary
#B2D9C2
accent
#D88650
background
#FDF9FB
surface
#FBF2F6
border
#D4CCD0
text
#150D12
muted
#837E81