HSL color stands for Hue, Saturation, and Lightness, and it's a way to describe colors more intuitively than RGB.
Hue represents the type of color (like red, green, or blue) as a value from 0 to 360 degrees on the color wheel.
Saturation controls the intensity or purity of the color (0% is gray, 100% is full color).
Lightness adjusts how light or dark the color is (0% is black, 100% is white).
HSL is widely used in web design because it's easier to adjust color shades and tones visually.
Red: hsl(0, 100%, 50%);
Green: hsl(147, 50%, 47%);
Blue: hsl(240, 100%, 50%);
Yellow: hsl(60, 100%, 50%);
Cyan: hsl(180, 100%, 50%)
Magenta: hsl(300, 100%, 50%)