HSL
A color model based on Hue (0-360°), Saturation (0-100%), and Lightness (0-100%) — designed to match how humans perceive color.
Definition
HSL stands for Hue, Saturation, Lightness. Hue is the color's position on the color wheel (0° = red, 120° = green, 240° = blue). Saturation is intensity (0% = gray, 100% = pure color). Lightness is how light or dark (0% = black, 50% = pure color, 100% = white). Designers prefer HSL over RGB because adjusting saturation or lightness produces predictable results.
Formula
hsl(H, S%, L%) where H is degrees on the color wheel, S and L are percentages.
Example
hsl(0, 100%, 50%) = pure red. hsl(276, 100%, 85%) = Mauve. Lowering lightness darkens; lowering saturation pulls toward gray.