Shades of Purple | Colormapped

Shades of Purple color ramp

These swatches are generated from one base hue using fixed HSL lightness steps. They are computed references, not official color names.

#FFE5FF HSL lightness 95%

#FFB3FF HSL lightness 85%

#FF80FF HSL lightness 75%

#FF4DFF HSL lightness 65%

#FF1AFF HSL lightness 55%

#E600E5 HSL lightness 45%

#B300B2 HSL lightness 35%

#80007F HSL lightness 25%

#4D004C HSL lightness 15%

Base reference: #800080. Use the Tints and Shades Generator when you need a ramp based on a specific project color.

Common CSS named purple colors

CSS purple-family names cover pale lavender, red-violet, blue-violet, and deep purple directions rather than one single hue line.

ColorCSS keywordHEX

Lavender lavender #E6E6FA

Thistle thistle #D8BFD8

Plum plum #DDA0DD

Violet violet #EE82EE

Orchid orchid #DA70D6

Medium Orchid mediumorchid #BA55D3

Medium Purple mediumpurple #9370DB

Blue Violet blueviolet #8A2BE2

Dark Orchid darkorchid #9932CC

Dark Violet darkviolet #9400D3

Rebecca Purple rebeccapurple #663399

Indigo indigo #4B0082

Named-color values above use the standardized CSS sRGB keywords documented by MDN. The list is curated for this color family; it is not a perceptually uniform scale.

Purple spans light lavender-like values, saturated mid purples, and dark violet tones. The generated ramp uses one base purple hue with fixed lightness steps, which makes it easier to see how lightness alone changes the usable character of the color.

If you need a brand or UI palette, treat this ramp as a starting reference rather than a naming standard. Small hue shifts toward blue or red can change the feel substantially even when two colors are both described as purple.

Useful next steps

Try a specific color in the Tints and Shades Generator, or browse other shade families.