Table of contentsClick link to navigate to the desired location
This content has been automatically translated from Ukrainian.
HSL is a color representation system based on three parameters: hue (Hue), saturation (Saturation) and lightness (Lightness). Each of these parameters defines different aspects of color:
- Hue: Determines the type of color and its place in the circle of shades. The shade is measured in degrees and can take values from 0 to 360.
- Saturation: Determines color saturation. The saturation value is from 0 to 100%, where 0% means no color (shade in gray state), and 100% - maximum saturation.
- Lightness: Determines the brightness of the color. The lightness value also varies from 0 to 100%, where 0% represents black, 100% represents white, and the values in the middle represent different shades of gray.
HSL is often used in web design and graphics for ease of definition and color handling, as this system provides intuitive options that reflect the ways in which people perceive and describe colors.
Number of possible HSL colors
The shade can have 360 different values (from 0 to 359). Saturation and lightness can have 101 different values (from 0 to 100). Total number of possible colors: 360×101×101=3,656,400.
So it's less than RGB and HEX.
HSL transparency
Alpha channel, it is absent in the original HSL model. However, there are advanced HSL variants such as HSLA (Hue, Saturation, Lightness, Alpha), where an alpha channel is added to determine color transparency. The HSLA format allows you to use HSL to determine color and add an alpha channel to control transparency.
This post doesn't have any additions from the author yet.
