Hot Pink #FF69B4

Hot Pink color (#FF69B4)

Hot Pink is one of the 148 CSS named colors. Use the keyword hotpink anywhere CSS accepts a color, or its hex code #FF69B4, which is rgb(255, 105, 180) in RGB.

It is a light, vivid warm color with a hue angle of 330° on the HSL color wheel and a perceived lightness of 73% in OKLCH. On a hot pink background, black text gives the higher contrast at 7.93:1, which passes WCAG AA for normal text.

Hot Pink color codes

CSS name hotpink
HEX #FF69B4
HEX (8-digit) #FF69B4FF
RGB rgb(255, 105, 180)
HSL hsl(330, 100%, 71%)
HSV / HSB hsv(330, 59%, 100%)
OKLCH oklch(72.8% 0.1971 352)
CMYK cmyk(0%, 58.8%, 29.4%, 0%)

Contrast with white and black

WCAG 2 contrast ratios and APCA lightness contrast (Lc) for hot pink used as text and as a background.

Aa Sample text
Hot Pink text on white
2.64:1 WCAG Lc 50.8 APCA Fails AA
Aa Sample text
Hot Pink text on black
7.93:1 WCAG Lc -51.1 APCA Passes AA
Aa Sample text
White text on hot pink
2.64:1 WCAG Lc -56 APCA Fails AA
Aa Sample text
Black text on hot pink
7.93:1 WCAG Lc 53.2 APCA Passes AA

Tints and shades of hot pink

Tints mix hot pink with white; shades mix it with black, in 10% steps. Click a swatch to copy it, or build custom scales in the tint & shade generator.

Tints

Shades

Colors that go with hot pink

Harmonies calculated on the HSL color wheel. Explore more in the color scheme generator.

Complementary

Analogous

Triadic

Split-Complementary

Hot Pink with color blindness

Approximately how hot pink appears with each type of color vision deficiency. Test full designs with the color blindness simulator.

Using hot pink in CSS

.element {
  color: hotpink;
  background-color: #ff69b4;
  border-color: rgb(255 105 180 / 50%);
  outline-color: oklch(72.8% 0.1971 352);
}

Similar named colors

See all shades of pink or browse every CSS color name.

Related tools