The HSL colour model is similar to the HSB model. HSL refer to adjustments that can be made to hue, saturation and lightness to produce different colours. HSB refer to adjustments that can be made to hue, saturation and brightness to produce different colours.
- The HSL and HSB are very similar models and are often used interchangeably. They both represent colours based on Hue, Saturation, and a third component.
- In the HSB colour model brightness refers to the overall luminance of a colour.
- In the HSB colour model, brightness represents the colour independent of adding white or black. It’s like a dimmer switch for the chosen colour.
- In the HSL colour model, lightness refers to how light or dark a colour appears, considering how our eyes perceive brightness relative to a neutral grey. This is why a 50% light value represents a medium tone, even though it might not be the same brightness for all hues.
- Both the HSB colour model and the HSL colour model are usually represented as a cylinder, where the hue is represented by an angle around the central axis, the saturation is represented as the distance from the central axis, and the brightness or lightness is represented as a distance along the vertical axis.
- The difference between the two models lies in how the lightness and brightness components are calculated. In HSB, the brightness value is calculated by summing the highest and lowest RGB components and then dividing by two. In HSL, the lightness value is calculated by averaging the highest and lowest RGB components.