Pink Shades
Every named color in the pink family, with computed conversions and contrast data — membership derived by computed hue, not a hand-maintained list. 32 colors shown below.
Quick facts (computed from this family's 32 members)
- Average lightness: 41%
- Average saturation: 80%
- 20 of 32 pass WCAG AA as normal text on white
- 12 of 32 pass WCAG AA as normal text on black
- Lightest named member: bubblegum pink
- Darkest named member: dark plum
- Most saturated member: DeepPink
The color science
Pink, roughly 310-330°, is technically a tint of red (red mixed with white, i.e. lower saturation and higher lightness at the same underlying hue) rather than its own spectral hue — which is why 'pink' doesn't appear as a distinct band on a standard hue wheel the way red, blue, or green do; it's a lightness/saturation phenomenon layered on top of the red-magenta hue range. The word itself is a relatively recent English color term, first attested in this sense in the late 17th century, borrowed from the name of the flower Dianthus (whose common name is literally 'pink,' possibly from the frilled/pinked edge of its petals). Because pink is fundamentally a lightness/saturation variant of red rather than a distinct hue-wheel position, this hub's computed membership genuinely overlaps at its edges with both the rose and fuchsia families — a color sitting right at 310° or 330° can reasonably be described as any of several adjacent family names depending on exactly where a given classification draws its boundary, which is a real and honestly acknowledged fuzziness rather than a data error. Pigment chemistry offers one genuine anchor point in the fuzziness, though: many natural pink pigments (in flowers, coral, and shellfish alike) come from the same broad family of anthocyanin or carotenoid compounds that also produce red, which is a real chemical reason pink and red share so much perceptual and linguistic overlap across unrelated organisms and cultures. Flamingos famously owe their pink feather color to carotenoid pigments obtained entirely through diet (specifically from the algae and crustaceans they eat), not from any pigment their own bodies produce — a captive flamingo fed a carotenoid-free diet will gradually turn pale or white, a well-documented phenomenon zoos have had to actively manage.
Common uses in design
Pink's association with femininity is a 20th-century social convention, not a historical universal — in much of 18th- and 19th-century Western dress, pink (as a 'diminutive of red') was frequently marketed as the more suitable color for boys, and blue for girls, with the modern reversal only solidifying in mid-20th-century American retail marketing rather than reflecting any older tradition. Pink's gendered marketing history has also made it one of the more actively contested colors in contemporary branding — a growing number of consumer product categories (razors, tools, even some children's toys) have deliberately moved away from a pink/blue split entirely in the last decade, treating the earlier convention as a marketing-driven artifact rather than a meaningful design constraint worth preserving. Pink also carries an entirely separate, unrelated symbolic use in public health and advocacy contexts — the pink ribbon associated with breast-cancer awareness campaigns since the early 1990s is a specific, deliberately chosen shade with no connection to the gendered fashion history above, illustrating how far a single hue's meaning can diverge across different cultural contexts operating at the same time. Millennial pink, a dusty, muted mid-tone that became a defining design-era color across branding, fashion, and interiors roughly from the mid-2010s onward, is a good example of pink acquiring yet another distinct cultural label entirely separate from any of its earlier historical associations.
Accessibility notes
Light pinks used as background fills generally perform well for contrast with dark text (similar to pale sky blue), but hot/saturated pinks used as text color on white frequently fail WCAG AA — as with red, it's the darker, more muted pinks (dusty rose, mauve-leaning) that clear accessible contrast ratios reliably as text on light surfaces. Because pink sits adjacent to red on the wheel, the same red-green color-vision-deficiency caution that applies to red also applies here to a lesser degree — a pink/green pairing used to encode meaning (rather than purely decoratively) is worth checking under a deuteranopia simulation before shipping, since the two can shift closer together than they appear to typical color vision. Because pink covers such a wide lightness/saturation range under one casual name, a genuine accessibility review of a 'pink' UI element should always check the specific hex value used rather than assume the general hue family's accessibility reputation applies uniformly across every shade someone might call pink. The safest general rule across the whole family remains the same one that applies to red: darker and more muted for text, brighter and more saturated reserved for accents and fills.
Named examples
HotPink and DeepPink are the two more saturated named pinks in the CSS set, both leaning noticeably toward magenta/fuchsia rather than the pale, desaturated pink most associated with the color's cultural stereotype. LightPink, by contrast, sits at a much higher lightness and lower saturation, closer to the pastel most people picture by default — the CSS set's inclusion of both extremes under related names is a useful illustration of just how much ground the casual word 'pink' actually covers. LightCoral and Salmon sit near enough to this family's edge that they're occasionally miscategorized as pink in casual conversation, despite genuinely belonging closer to the orange-red side of the wheel once measured rather than eyeballed. Bubblegum pink, a common informal name with no fixed hex value, is generally understood to describe a bright, slightly cool-leaning pink reminiscent of classic pink chewing gum — a good example of a widely understood color reference that has never been formalized into any standards body's named-color list.
Building a pink design-token scale
Pink token scales in modern product design increasingly skip the stereotyped pastel entirely in favor of a more saturated, deliberately gender-neutral 'brand pink' (Glossier and several D2C beauty brands built full identities around a specific dusty, muted pink chosen precisely to avoid the childish pastel connotation), which shows how the same base hue can carry very different weight depending purely on saturation and lightness choices, not the underlying hue value itself. A full numbered pink token ramp works best when the mid-tone step is chosen deliberately for both its visual character and its WCAG contrast performance against your surface colors, since — as with red — the difference between an appealing bright pink accent and an accessible pink used for actual text is usually a meaningful jump in saturation or lightness, not a small tweak. Because pink now spans such a broad range of cultural associations — from the historically gendered pastel to the deliberately reclaimed 'brand pink' to the entirely separate awareness-ribbon symbolism — a product introducing pink into its palette benefits from being explicit about which of those associations it actually intends to invoke. A brief internal style-guide note naming the specific association intended (playful, premium, medical/awareness, or gender-neutral-modern) can save a design team from unintentionally sending a mixed cultural signal later in a product's life.