UI Shades

A study in pink

Pink

#FFC0CB

Family
Pink
L
0.868
C
0.074
H

Notes

Pink in CSS is the soft, slightly warm pink of cotton candy. The hex is one of the gentler pinks in the spec, lighter than Hot Pink and warmer than Light Pink. Beauty, wellness, and fashion brands use it as a primary or secondary surface. Pair with deep burgundy for type, or with muted teal for a calmer secondary accent. Cultural associations are wide-ranging and have shifted significantly over the past century; pink has been masculine and feminine in different eras and regions, and context matters. Body text contrast against white fails AA, so it remains a surface tone.

#ffc0cb
Pink
Pink
#ffc0cb
oklch(0.868 0.074 7.09)
rgb(255 192 203)
hsl(349.5 100% 87.6%)
Share
#fff6f8
#ffedf1
#ffd8df
#ffc0cb
#e59daa
#bb7381
#a05b6a
#874855
#64323d
#461f28
#270e14

See your palette on a real UI - coming soon

Preview these shades across buttons, cards, and components in a live interface.

Plate 02

Palette built around Pink

Cross-reference
Q&A

Frequently asked questions

What is Pink?

Pink in CSS is the soft, slightly warm pink of cotton candy. The hex is one of the gentler pinks in the spec, lighter than Hot Pink and warmer than Light Pink. Its hex code is #FFC0CB.

What are the tints and shades of Pink?

uishades builds an 11-step OKLCH ramp for Pink (#FFC0CB) - its lightest tints through its darkest shades - plus an 11-stop Tailwind scale (50–950), both keyed to the same 50–950 stops. Lightness steps stay evenly spaced and the hue stays stable, so the mid-tones don't go muddy.

What colors pair well with Pink?

Its complementary color is #9BE4DC. Triadic partners are #C6DDA9 and #ADD9FF; analogous neighbours are #FFC3B2 and #F4C2E5.

What are the OKLCH and RGB values of Pink?

Pink is #FFC0CB - OKLCH 0.868 0.074 7°, rgb(255 192 203), in the pink family.