HSL Colors

HSL (Hue, Saturation, Lightness) is a way to define colors in CSS using three components: Hue, which represents the color type on a color wheel (0-360 degrees); Saturation, which indicates the intensity of the color (0-100%); and Lightness, which determines how bright or dark the color is (0-100%). This model offers a more intuitive way to adjust colors compared to RGB, allowing developers to easily create variations of a color by modifying its hue, saturation, or lightness values.

Visit the following resources to learn more:

• @article@hsl function
• @article@CSS HSL Colors
• @video@How to Create RELATIVE Colors with hsl(from...) CSS Tutorial