Shades of Pink
Pinks are light or vivid reds and magentas, spanning roughly 310° to 355° on the HSL wheel. Lightness defines the soft end of the family: a red with lightness pushed high becomes pink, as in pink itself at 88% lightness. At the vivid end, hot and deep pinks keep full saturation and lean toward magenta, and at lower lightness the family darkens into raspberry and violet-red. In RGB, pinks keep red at or near 255: pale pinks lift green and blue together, as in rgb(255, 192, 203), while vivid pinks drop green below blue, as in deeppink's rgb(255, 20, 147).
CSS pink (#FFC0CB) and lightpink (#FFB6C1) are pale tints near 350°. Hotpink (#FF69B4) sits at 330° and deeppink (#FF1493) at 328°, both fully saturated. Palevioletred (#DB7093) is a dusty, muted rose at 340°, useful where brighter pinks feel too loud.
7 pink CSS color names
Sorted from lightest to darkest by OKLCH lightness. Open any color for its codes, shades, harmonies and contrast.
Using pink in design
Pink ranges from gentle and romantic in its pale tints to bold and playful in hot and deep pinks. Bright pinks are popular in fashion, beauty, consumer apps and youthful brands, and a single hot-pink accent stands out on dark interfaces. Pale pinks make warm, soft backgrounds for cards and banners.
Accessibility tip: vivid pinks are lighter than they look. Hotpink #FF69B4 with white text measures 2.64:1 and deeppink #FF1493 3.63:1, both under the 4.5:1 AA minimum. For white text, go as deep as mediumvioletred (#C71585, 5.42:1), or put dark text on the pink.