Hexadecimal numbers and

C O L O U R !

How did I tell the computer which colour I wanted here?

The different colours on a computer screen are based on various combinations of the three primary colours for light of red, green and blue. Each of these three colours can run in strength from 00 (zero) to FF (the strongest form of the colour.)
The order of the three primary colours to give the desired mix is always the same, that is the red strength, followed by the green strength, followed by the blue strength.

I have coded my colours for the computer in angled brackets (this is how the computer language HTML is written). This is what my code looks like except that I have put spaces between the codes for the three different colours so that it is easier to see them separately. These spaces are taken out for actual code.

<font color="#FF 00 00"> gives RED ,
<font color="#00 FF 00"> gives GREEN ,
<font color="#00 00 FF"> gives BLUE .
and I made my background white by using <font color="#FF FF FF">.
Black is the default colour for print anyway, but I can specify it by writing <font color="#00 00 00">.

You can see the actual HTML code I have used by looking at my source file. You can do this by clicking `View' and then 'souce' or `document source' depending on your browser.
If you also look at other files, you will see that HTML isn't fussy about capital versus small letters so I can equally well make red by putting <font color="#ff 00 00">. It is fussy about spelling so I must write `color' and not `colour'.

Bright yellow comes from a mixture of red and green, which always amazes me because it is so different from mixing colours for painting. So writing the code <font color="#FF FF 00"> gives yellow .
Stage lighting works in exactly the same way. The three primary colours for light are red, green and blue while the three primary colours for print are red, yellow and blue. This intriguing difference is due to the physiology of the human eye.


What exactly do all these Fs signify?
You can think of them as meaning `full', but if you look at the code used for colours on other sites you will find examples like <font color="#B8D8EE"> which gives this colour .

The reason why these combinations of numbers and letters are used to code the different colours is because of how a computer works. The tiniest unit of information (which is called a bit) is recorded by current either flowing or not flowing through a connection and is represented by 1 if current flows or 0 if it doesn't. This means that the code which is making the computer work has to turn instructions into numbers involving only two symbols so it must use binary or base two arithmetic. I have described how binary arithmetic works in Section 1.F.(a) in my book. The trouble with binary numbers is that even quite small numbers involve a horribly large number of digits so they are very tedious for humans to work with. As an example, 110100110101 (which is gruesome to both copy and say) is only 3381 as an ordinary base ten (decimal) number.

Bundling eight bits together gives one byte. Since each of the 8 bits in a byte can be 0 or 1, the possible value of a byte can be anything from 00000000 to 11111111 or 0 to 255 in ordinary base ten numbers, giving 256 different possible values altogether.
You could also see this by thinking that, as each bit can be either 0 or 1,
there are 2 x 2 x 2 x 2 x 2 x 2 x 2 x 2 = 28 = 256 possibilities.
(Just in case your browser doesn't support the `sup' tag, this should read as 2 to the power 8 and not 28.)

Computers naturally work in powers of two, and binary numbers can be conveniently telescoped for joint computer and human use by writing them as hexadecimal numbers or `hex' numbers.
These numbers use a working `ten' of 2 x 2 x 2 x 2 = 16 so we write 16 as 10 in hexadecimal.
Binary numbers have the 2 symbols of 0 and 1, and decimal numbers have the 10 symbols from 0 to 9 before they each need to move into double figures. Similarly, hexadecimal numbers will need 16 symbols before they move to double figures.
The numbers up to 9 can be written in the usual way, but then we need to find new labels so we move on to letters.
I show the agreed scheme for this in the table below.

decimal  1   2   3   4   5   6   7   8   9  10 11 12 13 14 15 16
hexadecimal  1   2   3   4   5   6   7   8   9  A B C D E F 10

Now we can see what the FF, which I've used to code my strongest colours, stands for.
It is the largest two-digit hexadecimal number, in the same way that 99 is the largest two-digit base ten number. Its value is equal to the decimal number (15 x 16) + 15 = 255, so it is the same as the binary number 11111111 or the largest value which can be held in one byte.

I gave the example earlier of the font color #B8 D8 EE. This is how the different strengths convert to decimal numbers.
In order to avoid any confusion between the decimal and hexadecimal numbers I have used the $ prefix in front of the hexadecimal or hex numbers when I'm doing arithmetic.
The red strength was $B8 = (11 x 16) + 8 = 184, giving this red.
The green strength was $D8 = (13 x 16) + 8 = 216, giving this green
and the blue strength was $EE = (14 x 16) + 14 = 224 + 14 = 238, giving this blue.

And they all combine to give this colour.

It seems, there is a huge range of colours to choose from. Since each of the three components of a colour can be given any value from 0 to 255, in theory we can make 256 x 256 x 256 = 16777216 different colours. This 3 x 8 = 24 bit information per pixel is what is used in the highest quality computer images but it requires a large amount of memory. Practically, there is a web safe restricted palette of 216 colours which are displayed the same on every platform. Other colours are approximated but sometimes in unpleasant ways. A colour which looks attractive on your monitor may look horrible on somebody else's.

Here is another example of how a colour is made up of its three components taking the web safe colour of #CC 99 33. Web safe colours have three pairs of repeated digits (chosen from 0,3,6,9,C and F giving a total of 6 x 6 x 6 = 216 possibilities) so they aren't quite so interesting as examples of hexadecimal arithmetic.

Here is how the different strengths convert to numbers this time.
The red strength is $FF = (15 x 16) + 15 = 255 giving the same red.
The green strength is $CC = (12 x 16) + 12 = 204, giving this green
and the blue strength is $33 = (3 x 16) + 3 = 51, giving this blue which is almost black since #00 00 33 is nearly the same as #00 00 00.

And they all combine to give this colour.

a mouse with a mouse

Return to the book home page   or   look at the contents of chapter 1 first.