APPENDIX 1: HTML Colour Codes
If none of these take your fancy and you want something that matches one of the colours in a graphic or logo, say, then just open that graphic in an image editor like Photoshop, use the palette eyedropper tool and you will be told the RGB colour of that area of your graphic. All you then do is convert that RGB code to hex. These days, tools like Photoshop usually have settings in the palette display area that can be set to tell you the HTML hex colour code as well. If they don't, you can easily convert to the hex value - just type "rgb to hex converter" in Google and you'll get many places that you can do this on-line. If you want to know more about all this hex stuff because you are nuts like me and actually enjoy maths, or simply because you want to know how to manually convert the RGB to hex and vice versa yourself (important graphic design skill, that is!), then the Appendix 1: Colour Codes page will tell you all you need to know!
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