In the HSL color system, colors
are represented by three values:
Hue, Saturation, and Lightness.
Hue: This refers to the color
itself and is measured in degrees
on a circular color wheel as
we can see in the above image.
This starts at red (0°) and
goes through orange, yellow,
green, blue, and magenta, ending
back at red (360°).
Saturation: When we look at colors,
some of them are really bright and strong,
while others are more muted or dull.
The brightness and strength of a color is
called its "saturation."
Saturation is measured as a percentage,
which is a way of showing how pure/strong
is the color.
Lightness: This refers to the
brightness of the color and is
also measured as a percentage.
A lightness of 0% represents black,
while 100% represents white.
Let's take a look at an example
to understand better:
