Color family
Shades of pink
A pale, muted pink. The reference pink is #FFC0CB, as defined by the CSS named color.
| HEX | #FFC0CB | |
|---|---|---|
| RGB | rgb(255, 192, 203) | |
| HSL | hsl(350, 100%, 88%) | |
| HSV | hsv(350, 25%, 100%) | |
| OKLCH | oklch(86.8% 0.074 7.1) | |
| CMYK* | 0, 25, 20, 0 |
* CMYK is a simple conversion without a print profile; ask your printer for exact values.
What color is pink?
Pink is a pale or tinted red. The name comes from the pink flowers of Dianthus plants, whose petal edges look as if cut with pinking shears; the colour was named after the flower, not the other way round. The CSS keyword pink is a soft, light shade, while the pink most people picked in the xkcd survey is noticeably brighter.
Pink hex codes by source
Color names are not standardized, so the same name can point to different colors. Here is every definition of pink in our three sources, with how close each one is to the reference.
| Name | HEX | Source | Compared with the reference |
|---|---|---|---|
| Pink | #FFC0CB | CSS named color | Reference shown on this page |
| Pink | #FF81C0 | xkcd Color Survey | Noticeably different · 42% similar |
| Pink | #FFC0CB | Color Names (meodai) | Same color |
Pink vs Light Pink
#FFC0CB
#FFB6C1
Light pink in CSS is a shade darker and slightly more saturated than the pink keyword, despite its name. In numbers: the two are 90% similar (OKLab distance 0.024). See Light Pink for its own codes.
Named shades of pink
78 names in the CSS keywords and the xkcd Color Survey belong to the pink family. They are sorted from light to dark; click a swatch to copy its code, or open the ones with their own page.
Light pink shades 19
Medium pink shades 57
Dark pink shades 2
Tints and shades of pink
The same hue from light to dark, generated in OKLab so the steps look even. Click a step to copy its HEX code.
Colors that go with pink
Classic color-wheel combinations built on #FFC0CB, computed in OKLCH so the partners keep the same lightness and intensity. Each swatch shows the nearest common name.
Complementary
Analogous
Triadic
Split complementary
Pink with white and black text
WCAG asks for a contrast of at least 4.5:1 for body text (AA) and 3:1 for large text. On a pink background, black text is the better choice.
Use pink in CSS
.pink {
color: #FFC0CB;
/* or */ color: rgb(255 192 203);
/* or */ color: hsl(350 100% 88%);
/* or */ color: oklch(86.8% 0.074 7.1);
/* CSS keyword */ color: pink;
}