Colour Depth in Images

The aim of this page is to illustrate the difference colour depth and image quality make to the appearance of an artificial image: artificial because this makes it easier to see what happens. A companion page shows a full colour photo example to illustrate file formats and compression in real images.
The first images start with a 24-bit colour sweeping from red to blue. The following 4 images have reduced numbers of colours so you can see the banding this causes, and see why it happens. I instructed the computer, using an image processing program, to reduce the number of colours.
The second set of images show the same picture with varying degrees of JPEG compression. You will see the greater the compression the smaller, but poorer quality, the file. Similar banding occurs, but the JPEG compressor tries to reduce the impact of it by feathering the line between the bands.

original as 24-bit colour jpeg saved with 100% quality. Size 23k You can upload the original TIF file from which this was produced if you wish - TIFs do not display in web browsers. The tif is 470k bytes (!)	This is what the first image looks like if reduced to 2 colours. Note that the computer had to decide what colour each pixel was, and had just 2 (red and blue) to choose from. The banding (ie the two colours) is obvious! No size given here as we are illustrating colour depth, and the image is artificial.	This is what the first image looks like if reduced to 3 colours. Hence 3 bands.
This is what the first image looks like if reduced to 16 colours...16 bands of colour.	This is what the first image looks like if reduced to 256 colours. The banding is far more subtle, but you can still see how the computer has changed the smoothness of the variation in tone of the first image into blocks of 256 (this time) colours.
This is what the original looks like as a GIF. No detail is thrown away, but the colours are limited to 256, hence the same banding as the 256-colour version at the start of the page. (Which is a JPEG, but forced to show only 256 colours; JPEG can do better, GIF can't, so restrict to using for images that don't have so many colours.) Size 59k	A JPEG (which can show all the colours) reduced to 85% quality - hence a slightly smaller file, but you can see the banding and artifacts that creep in as a result of the compression.Size 3.8k	JPEG saved at 50% quality. Size 1.7k
JPEG saved at 15% quality. Size 1.5k	JPEG saved at 1% quality. Size 1.3k	(see the full colour photo example for an illustration of file formats and compression in real images)