FreeToGenerate.com

100% free · hex, RGB & HSL · no sign-up

Click any code to copy it — clicking the swatch copies the hex.

17 shades
  • LavenderBlushCSS
  • MistyRoseCSS
  • Baby Pink
  • PinkCSS
  • LightPinkCSS
  • Bubblegum Pink
  • Salmon Pink
  • Watermelon
  • Flamingo
  • HotPinkCSS
  • Neon Pink
  • Rose
  • DeepPinkCSS
  • Cerise
  • PaleVioletRedCSS
  • MediumVioletRedCSS
  • Magenta Haze

Also available in: Español · Português · Français · العربية

Shades of Pink: Hex, RGB, and HSL Codes

17 shades of pink with hex, RGB, and HSL codes — from LavenderBlush #FFF0F5 to MediumVioletRed #C71585. Click any code to copy it free, no sign-up.

What counts as a shade of pink?

Pink is not a hue of its own — it is red with the lightness raised or the saturation cut, which is why the 17 shades below sit across such a wide range. The palest, LavenderBlush #FFF0F5 and MistyRose #FFE4E1, are barely tinted whites. The middle holds the pinks people actually name: Pink #FFC0CB, LightPink #FFB6C1, Bubblegum Pink #FFC1CC. The deep end — DeepPink #FF1493, Cerise #DE3163, MediumVioletRed #C71585 — is closer to magenta than to blush.

The most useful distinction here is warm versus cool. Salmon Pink #F88379, Watermelon #E37383, and Flamingo #FCA3B7 carry orange and read as soft and natural; HotPink #FF69B4, Neon Pink #FF10F0, and Rose #FF007F carry blue and read as electric. Mixing the two groups in one palette is the fastest way to make a design look accidental, so pick a side before you pick a shade.

How to use these color codes

  1. Find your shade. The list runs roughly light to dark, with a live preview beside every name — scan it the way you would a paint chart.
  2. Click a code to copy. Each row carries the hex, RGB, and HSL value of that color. One click copies that exact string to your clipboard.
  3. Paste it into your project. Drop the hex into CSS, Figma, Photoshop, or a document. Clicking the swatch itself copies the hex, so you can grab colors without aiming at the small text.

What pink communicates

Pink's gendered reading is recent and regional — before the 1940s it was routinely marketed as the boys' color, being a diluted red. Treat it as a live cultural variable rather than a fixed meaning, especially in work for markets outside the West.

Its consistent effect is softening. A pale pink takes the aggression out of red while keeping its warmth, which is why it dominates in skincare, confectionery, and hospitality. The saturated end does the opposite: HotPink and Neon Pink are deliberately loud and slightly rebellious, carrying strong associations with punk, pop, and 1980s design that a brand either wants or must actively avoid.

Honest limitations

A hex code is exact, but the color you see is not. The same #FF0000 looks different on an OLED phone, a cheap office monitor, and a printed page, because each device has its own gamut and calibration. Treat these values as a precise starting point for screens, and always check a physical proof before committing a color to print — CMYK cannot reproduce every shade listed here.

Color names are a mix of two things. Entries badged CSS are official CSS named colors: the name itself works in a stylesheet and every browser resolves it to exactly that hex. The rest are conventional names — Burgundy, Sage, Espresso — that no standards body owns. Their hex values follow the most widely cited convention, but another chart may place them a few percent lighter or darker, so quote the hex rather than the name when the exact value matters.

Why is it free?

FreeToGenerate.com keeps every tool genuinely free. This page is a static list of color values rendered in your browser — nothing to install, no account, no premium tier holding back the darker half of the palette. Copy as many codes as you need, as often as you need.

Other color families

redorangeyellowgreencyanbluepurplebrowngrayblackwhiteAll color families