Color code and palette
Shades of Pink
Pink can move from gentle blush to energetic magenta. The softer end supports welcoming surfaces while stronger shades create expressive accents for modern editorial and product design.
Pink #EC4899
Color formats
The same base color in common web formats.
HEX
#EC4899 RGB
rgb(236, 72, 153) HSL
hsl(330, 81%, 60%) OKLCH
oklch(66.0% 0.212 354.0) Pink can move from gentle blush to energetic magenta. The softer end supports welcoming surfaces while stronger shades create expressive accents for modern editorial and product design.
Shades
| Color | Name | Hex | |
|---|---|---|---|
| Blush Light | #FDF2F8 | ||
| Rose Quartz | #FCE7F3 | ||
| Cotton Candy | #FBCFE8 | ||
| Bubblegum | #F9A8D4 | ||
| Carnation | #F472B6 | ||
| Pink | #EC4899 | ||
| Hot Pink | #DB2777 | ||
| Magenta Pink | #BE185D | ||
| Raspberry | #9D174D | ||
| Dark Pink | #831843 | ||
| Rose Light | #FFF1F2 | ||
| Rose | #FFE4E6 | ||
| Rose Medium | #FECDD3 | ||
| Salmon | #FDA4AF | ||
| Coral Pink | #FB7185 | ||
| Watermelon | #F43F5E | ||
| Cerise | #E11D48 | ||
| Cherry Pink | #BE123C | ||
| Cranberry | #9F1239 | ||
| Burgundy Pink | #881337 |
Triadic color harmony
Three evenly spaced hues create a colorful but balanced starting palette.
Text contrast
These ratios use the WCAG relative luminance formula.
White textNaN:1
Black textNaN:1
Ways to use pink
01
Welcoming lifestyle interfaces
02
Expressive editorial accents
03
Beauty, fashion and consumer branding