The three components of a colour

We cut through the jargon to explain the basic concepts and terminology of colour theory, in words that you can understand.

The three component parts that help us define a colour are hue, saturation and brightness

Yellow is yellow is yellow, right? Well, actually, no; there are many different colours we could refer to as yellow. Different shades or tints, saturations and hues are all possible while still being within the yellow part of the colour wheel. As a result, there are three primary component parts that help us define a colour:

01. Hue This is the position on the colour wheel, and represents the base colour itself. This is typically referred to in degrees (around the colour wheel), so a yellow colour will appear between 50 and 60 degrees, with the perfect yellow appearing at 56 degrees. Green, meanwhile, appears at 120 degrees on the wheel at so on. 02. Saturation This is a representation of how saturated (or rich) a colour is. Low saturation results in less overall colour, eventually becoming a shade of grey when fully desaturated. Saturation is normally referred to as a percentage between 0 and 100%. 03. Brightness This is how bright a colour is, typically expressed as a percentage between 0 and 100%. A yellow at 0% brightness will be black, while the same yellow hue and saturation at 100% brightness will be the full yellow colour.

Colour gamut

Colour gamut describes the range of potential colours a system can reproduce

Colour gamut is a way of describing the full range of potential colours a system can reproduce. It may surprise you to learn that the range of colours achievable in CMYK is different to that you can achieve with RGB.

This is partially because of the nature of the two different systems, but also (in the real world at least) as a consequence of limitations in our technology - screens aren’t always capable of producing the same range of colours as each other, and pigments reflect light at a non-uniform rate as you reduce their saturation. Colour perception Finally, it’s worth looking at how different colours can affect the way we perceive other colours. A typical illustration of this features a mid-grey tone placed over a light grey background, and the same mid-grey tone shown over a dark grey background. The apparent brightness of the mid-grey is altered according to the context in which you see it – a trick of the eye, working to make sense of its surroundings. Hues works in the same way as tones when placed adjacent to other colours, allowing you to create different effects using the same palette of colours.



Was this article helpful? please comment below to know more