UI Shades

A study in pink

Hot Pink

#FF69B4

Family
Pink
L
0.728
C
0.197
H
352°

Notes

Hot Pink is the bright, saturated pink that dominated 1980s pop fashion and resurfaces in cosmetic, music, and youth-targeted branding. The CSS hex is one of the most attention-grabbing colors in the spec, with high chroma at moderate lightness. Large fields of Hot Pink fatigue the eye and can read as juvenile, so it works better as an accent than as a body color. Pair with deep navy for type, with cream for a softer editorial palette, or with chartreuse for a high-energy complementary clash. Body text contrast against white passes AA only at sizes 18px and above.

#ff69b4
Hot Pink
Hot Pink
#ff69b4
oklch(0.728 0.197 351.99)
rgb(255 105 180)
hsl(330 100% 70.6%)
Share
#fff1fc
#ffe9f7
#ffd2ea
#ffb7dc
#ff69b4
#e24598
#c5247f
#a8056a
#7e004d
#590034
#33001b

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 Hot Pink

Cross-reference
Q&A

Frequently asked questions

What is Hot Pink?

Hot Pink is the bright, saturated pink that dominated 1980s pop fashion and resurfaces in cosmetic, music, and youth-targeted branding. The CSS hex is one of the most attention-grabbing colors in the spec, with high chroma at moderate lightness. Its hex code is #FF69B4.

What are the tints and shades of Hot Pink?

uishades builds an 11-step OKLCH ramp for Hot Pink (#FF69B4) - 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 Hot Pink?

Its complementary color is #00C79B. Triadic partners are #ABB100 and #00B7FF; analogous neighbours are #FF6B6E and #DF76EF.

What are the OKLCH and RGB values of Hot Pink?

Hot Pink is #FF69B4 - OKLCH 0.728 0.197 352°, rgb(255 105 180), in the pink family.