#DF4CAC#DF4CAC
#DF4CAC is a light, highly saturated pink. Relative luminance 0.238; OKLCH L 64.7% C 0.207 H 344.3°. Best body text is #000000 at 5.77:1 contrast (WCAG AA passes).
Color values
| HEX | #DF4CAC |
|---|---|
| RGB | rgb(223, 76, 172) |
| HSL | hsl(321, 70%, 59%) |
| HSV | hsv(321, 66%, 87%) |
| CMYK | cmyk(0%, 65.9%, 22.9%, 12.5%) |
| CIE-LAB | lab(55.93, 66.11, -20.99) |
| CIE-LCH | lch(55.93, 69.36, 342.39°) |
| OKLab | oklab(64.73% 0.199 -0.0559) |
| OKLCH | oklch(64.73% 0.207 344.3) |
| XYZ | xyz(40.4637, 23.8394, 41.4922) |
| Luminance | 0.2384 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Closest named colors
Purplish Pink
#CE5DAE
ΔE00 3.48
Pale Magenta
#D767AD
ΔE00 4.82
Bright Pink
#FE01B1
ΔE00 5.06
Purpleish Pink
#DF4EC8
ΔE00 5.14
Shocking Pink
#FE02A2
ΔE00 5.78
Barbie Pink
#FE46A5
ΔE00 6.34
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#DF4CAC #4CDF7F
analogous
#C84CDF #DF4CAC #DF4C62
triadic
#DF4CAC #ACDF4C #4CACDF
tetradic
#DF4CAC #DFC84C #4CDF7F #4C62DF
square
#DF4CAC #DFC84C #4CDF7F #4C62DF
split-complementary
#DF4CAC #62DF4C #4CDFC8
monochromatic
#961B6B #CA2490 #DF4CAC #E880C4 #F2B4DC
Accessibility & contrast
On white
3.64
#DF4CAC on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.77
#DF4CAC on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #DF4CAC
5.77:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##DF4CAC | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##DF4CAC | 1.00 | 3.64 | 5.77 | 5.77 |
| #FFFFFF | 3.64 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.77 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.77 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#5B76AF
Deuteranopia (green-blind)
#868FA8
Tritanopia (blue-blind)
#ED4B75
Achromatopsia (no color)
#868686
Design tokens & code
CSS
--color: #df4cac; /* rgb */ color: rgb(223, 76, 172); /* oklch */ color: oklch(64.7% 0.207 344.3);
Tailwind
colors: {
custom: {
50: '#ed88c5',
500: '#df4cac',
950: '#000000',
},
}SCSS
$custom: #df4cac; $custom-light: #ed88c5; $custom-dark: #000000;
JSON
{
"hex": "#df4cac",
"rgb": {
"r": 223,
"g": 76,
"b": 172
},
"hsl": {
"h": 320.816,
"s": 69.668,
"l": 58.627
},
"oklch": {
"l": 0.64729,
"c": 0.20671,
"h": 344.3
},
"luminance": 0.23835
}Semantic roles & 50–950 ramp
primary
#DF4CAC
secondary
#A6E0BB
accent
#EC793B
background
#FFF8FC
surface
#FEF0F8
border
#D6CBD1
text
#170C12
muted
#857D81