Где нужны именно каналы
CSS понимает hsl() уже много лет, но многое вокруг — нет: массивы пикселей
canvas, большинство библиотек для изображений, нативные типы цвета в мобильной
разработке и немало API, которым нужны три целых числа.
Коротко про арифметику
Тон выбирает грань цветового круга; насыщенность и светлота масштабируют величину цветности и сдвигают её. На выходе три целых от 0 до 255 с округлением — поэтому путь RGB → HSL → RGB может сдвинуть канал на единицу.
Значения за пределами диапазона
Тон заворачивается: -120 это 240. Насыщенность и светлота ограничиваются:
всё выше 100 становится 100. Так же поступает CSS, поэтому здешние числа
совпадут с браузерными.
Вопросы
Зачем RGB, если CSS понимает hsl()?+
Потому что многое вокруг CSS не понимает: массивы пикселей canvas, большинство библиотек для изображений, нативные типы цвета в мобильной разработке и немало API хотят три целых числа.
Что будет с hsl(-120, …)?+
Тон заворачивается, это то же самое, что 240. Насыщенность и светлота ограничиваются, а не заворачиваются — как и в CSS.
Каналы округляются?+
Да, до целых от 0 до 255. Именно из-за этого округления путь RGB → HSL → RGB может сдвинуть канал на единицу.