APPENDIX 1: HTML Colour Codes
Warning - Maths Alert!: If you don't like maths, don't read this - there's no need and you can easily write HTML without knowing any of this paragraph which is just here if anyone is sad enough like me and wants to know a bit more about hex! Strapped in? Here goes...
Decimal is what is called a "base 10" number system - there are ten values: 0,1,2,3,4,5,6,7,8,9. Binary (the lowest leven of language that your computer speaks) is what is called a "base 2" number system - there are only two values: 0 and 1 and these correspond to voltage states in a computer's circuitry (&uqot;on" or "off") which is why computers speak this language, so to speak!! Hexadecimal is what is called a "base 16"number system - there are sixteen values: 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F - see, count those up on your fingers and you'll see there are sixteen of them - you always have to remember to count the "0" when talking about numbers in this way - not intuitive I know! Thus "F" can be thought of as analogous to 10 decimal, i.e the next number after 10 decimal is 11, but in hex the next value is F1 which is 16 because F is 15 in decimal and adding a 1 to it makes 16 in decimal.
How does all that relate to colour codes in hex? Well, each two letter section of "ffffff" codes for red, green and blue - in that order Hence, "ff0000" is red, "00ff00" is green and "0000ff" is blue. In transmitted light, equal amounts of red, green and blue give white, thus "ffffff" is white in hex (this is additive mixing not subtractive mixing as you get with paints when equal amounts of red, green and blue would not give white! If you don't get that, look up "additive colour" in Wikipedia!). "000000" is in effect "nothing of anything" so is black. You can probably see that changing the letters or numbers will give different colours - look at Appendix 1: Colour Codes and you'll see what I mean!
So if you have a graphic in, say, Photoshop and you have used the eyedropper to measure the colour, you will be lucky enough that in later versions of Photoshop it will actually tell you the hex value! In the "old days" we weren't so lucky and had to work it out ourselves - let's have a look at how.
In graphic design, colour codes are spoken of in terms of the percentages of RGB (red, green,
blue), so have an "RGB value". In commercial printing, the colour code is CMYK (cyan, magenta, yellow,
key (which is black)). So, when you open a coloured graphic in Photoshop or similar, it will be made up of as
many different RGB (or CMYK) values as it was designed to have! Luckily we don't normally have to worry about
CMYK conversions to hex - most graphic programs have always given the RGB equivalent of the CMYK colour code for
a particular area of the graphic. However, when you are trying to code a web page according to your company
colours or logo colour, you should use a colour picker tool to select from the graphic the colour you want to
sample and it will give an RGB value. Say the RGB value is 24,75,245. How do you get this to be in hex? Easy.
Just take each of the three values and divide them by 16. So for the 24, go 24/16 on your calculator (or brain!)
and the answer will be "1.5". Trouble is that this is in decimal and you need to convert it to hex.
Easy, just ignore what is after the decimal point! So just take the "1" as being the equivalent
of 1 x 16 in hex and count up to 24 from 16 which gives 8, thus the hex value of decimal 24 is merely 18, because in hex the "1" means 1 x 16 in decimal
plus 8 which is, yep, 24!
, 15 decimal goes
into 24 only once, with 9 decimal remaining. The hex code for 15 is F and the hex code for 9 is 9. Therefore the nex
equivalent of 24 decimal is simply F9. For the "75" part of the RGB code I gave above, this would be
a hex code of 50 because 5 x 15 is 75 with nothing left over. For the "245" part of the RGB code above
this comes up on the calculator when you go 245/15 as 16.3333, a hex code of F
BLACK = #000000
NEXT: So what can you do in the