RGB is 24-bit color; whereas HSL is only 22-bit so has a palette less than a quarter the size. The math under the hood is also very simple, and the colors can be computed very easily. Pick any hue, red, green or blue, and then compute (or assign) the percentage value of saturation, and the percentage value of lightness.
We can almost tell just from looking at it what an HSL color will be. The hues are divided up into 120 sub-hues for each of the three main hues. The modulus of,
hue % 120 (needs correction, we're looking for 0, 1 or 2)
will tell us if it is red, green or blue as the base. The higher the middle value (S), the more saturated the color. The higher the third value (L) the brighter the color.
Saturation is a pretty tough concept to understand, but in plain terms, the lower the value, the wider the spectrum within the hue range, meaning we are mixing more color frequencies. The lowest value will be anything but that hue. More like gray. The highest value is a narrow spectrum dialed right into practically one individual color of the hue spectrum. It mixes only slightly with the color to its left and the color to its right which bleed into that single color.
Say we have a color with H=60. That is in the red part of the HUE spectrum. If S=0 we won’t see much of the redness, only a hint. If S=100 it will be a solid color (assuming L is non-zero; for our purposes let’s set L=50) with only a tiny bit of bleed from H=59 and H=61. As we lower the value for S, more colors from the left and from the right will be mixed in. If S=50 we might think of all the colors from H=30 to H=90 as being mixed in by diminishing degrees the farther they are from the central hue.
| more saturation |
30 55 60 65 90
|----------> more --> | <-- more <----------|
less mixing mixing less
| less saturation |