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.
- In the HSB colour model, brightness refers to the perceived intensity of light insofar as it affects the appearance of a colour.
- Brightness (which in some situations is referred to as value) represents the intensity of a colour. Brightness ranges from 0% (completely black) to 100% (full brightness, of the colour).
- In the HSB model, the brightness component represents the actual brightness of the colour in a more straightforward manner, without considering the perceptual aspects.
- The HSB colour space is usually represented as a cylinder, where the hue is represented by an angle around the central axis, the saturation is represented as distance from the central axis, and the brightness is represented as distance along the vertical axis.
HSV_color_solid_cylinder.png: SharkDderivative work: SharkD Talk, CC BY-SA 3.0, via Wikimedia Commons
- In the HSL colour model, lightness refers to the perceived intensity of light insofar as it affects the appearance of a colour.
- Lightness, represents the perceived brightness of a colour relative to a neutral grey. Lightness ranges from 0% (completely black) to 100% (completely white), with 50% representing the mid-tone and fully saturated colour.
- In the HSL model, the lightness component aims to perceptually represent the brightness of the colour, taking into account how our eyes perceive brightness in different hues. As a result, it can be more visually consistent.
- The HSL colour space is usually represented as a cylinder, where the hue is represented by an angle around the central axis, the saturation is represented as distance from the central axis, and the lightness is represented as distance along the vertical axis.
HSL_color_solid_cylinder.png: SharkDderivative work: SharkD Talk, CC BY-SA 3.0, via Wikimedia Commons
- 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.
- Both models are used to represent colours in a way that is more intuitive and user-friendly for adjustments compared to the RGB model.
- Due to the similarity between HSB and HSL, they are often used interchangeably, and the difference in implementation is minor. Many software applications, including Adobe software, implement HSB (Hue, Saturation, Brightness) as a way to adjust colours easily and intuitively.