Grayscale versions of colour 02

Just to add to the earlier post, I thought I’d justify the need to spare a thought for the brightness of colours – by converting them to grayscale, for clarity.

The combinations of colours in the first two rows below are all created using the same grayscale values – namely those shown in the first 3 grey columns. So the variation in hue can, obviously, change dramatically while the percentage of black stays the same.

To demonstrate the variation in hues between colours of the same darkness (55% black in grayscale versions here) a long horizontal strip of swatches has been added – below it I have included the grayscale versions of these colours and, as can be seen, they’re all equal – 55% black.

In the first of the 4 text boxes below, we can see how awful text can look if its darkness is equal to that of the colour of its background. Usually, in these situations, there’ll be an ugly haze around the text because, in effect, the boundaries between the colours are so weak that they’re spilling into each other. Avoiding these problems is easily done by eye – most of the time. Sometimes, as with the last 3 images below, strong contrasts in hue make up somewhat for the completely equal brightness of two colours – but the outcome of their being combined is still dull/lifeless even when strong colours are used because of the equal grayscale values. So it’s, again, worth working in grayscale before colour, just to get the light/dark values of your work just right before adding colour.