#CF567F#CF567F
#CF567F is a mid, vivid pink. Relative luminance 0.215; OKLCH L 61.9% C 0.158 H 1.7°. Best body text is #000000 at 5.29:1 contrast (WCAG AA passes).
Color values
| HEX | #CF567F |
|---|---|
| RGB | rgb(207, 86, 127) |
| HSL | hsl(340, 56%, 57%) |
| HSV | hsv(340, 58%, 81%) |
| CMYK | cmyk(0%, 58.5%, 38.6%, 18.8%) |
| CIE-LAB | lab(53.45, 51.70, 1.52) |
| CIE-LCH | lch(53.45, 51.73, 1.68°) |
| OKLab | oklab(61.91% 0.1577 0.0046) |
| OKLCH | oklch(61.91% 0.158 1.7) |
| XYZ | xyz(32.8927, 21.4569, 22.4839) |
| Luminance | 0.2145 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Closest named colors
Darkish Pink
#DA467D
ΔE00 2.89
Blush
#DE5D83
ΔE00 3.81
Dark Pink
#CB416B
ΔE00 5.41
Rose (survey)
#CF6275
ΔE00 5.64
Deep Rose
#C74767
ΔE00 5.92
Pinkish
#D46A7E
ΔE00 6.32
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#CF567F #56CFA6
analogous
#CF56BC #CF567F #CF6956
triadic
#CF567F #7FCF56 #567FCF
tetradic
#CF567F #BCCF56 #56CFA6 #6956CF
square
#CF567F #BCCF56 #56CFA6 #6956CF
split-complementary
#CF567F #56CF69 #56BCCF
monochromatic
#852646 #B5335F #CF567F #DD86A3 #EAB5C7
Accessibility & contrast
On white
3.97
#CF567F on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.29
#CF567F on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #CF567F
5.29:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##CF567F | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##CF567F | 1.00 | 3.97 | 5.29 | 5.29 |
| #FFFFFF | 3.97 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.29 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.29 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#6C7180
Deuteranopia (green-blind)
#8C887C
Tritanopia (blue-blind)
#DF4A66
Achromatopsia (no color)
#808080
Design tokens & code
CSS
--color: #cf567f; /* rgb */ color: rgb(207, 86, 127); /* oklch */ color: oklch(61.9% 0.158 1.7);
Tailwind
colors: {
custom: {
50: '#e28ba4',
500: '#cf567f',
950: '#000000',
},
}SCSS
$custom: #cf567f; $custom-light: #e28ba4; $custom-dark: #000000;
JSON
{
"hex": "#cf567f",
"rgb": {
"r": 207,
"g": 86,
"b": 127
},
"hsl": {
"h": 339.669,
"s": 55.76,
"l": 57.451
},
"oklch": {
"l": 0.61911,
"c": 0.15774,
"h": 1.7
},
"luminance": 0.21453
}Semantic roles & 50–950 ramp
primary
#CF567F
secondary
#A8D9C8
accent
#DFAC49
background
#FEF8FA
surface
#FDF0F3
border
#D5CBCD
text
#160C0F
muted
#847D7F