O que é HSL? Trabalhando com matiz, saturação e luminosidade

HSL descreve uma cor com três valores: Matiz (Hue), Saturação (Saturation) e Luminosidade (Lightness). O matiz é um ângulo de 0–360°, enquanto a saturação e a luminosidade são expressas como 0–100%.

Alterar apenas o matiz muda o tom; reduzir a saturação move em direção ao cinza, e aumentar a luminosidade move em direção ao branco. Isso é próximo de como as pessoas ajustam a cor intuitivamente, o que o torna prático para criar paletas.

Por exemplo, variar apenas a luminosidade de uma cor produz uma paleta natural de tons e matizes. A ferramenta de paleta acima usa exatamente esse princípio.