I’ve known about hexadecimal color values for HTML probably since 1994, back in Netscape Navigator Beta days. I’ve always known that they represent a group of Red-Blue-Green values, that when modified you get a new color, however slight or dramatic. Each position can have a value of 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e or f.

But I never really understood why such a silly system that required me to open Photoshop or use Dreamweaver to find the color I’m looking for; that is until today.

Most of us humans do math with a base of 10 (1, 10, 100…). However computer binary code uses a base of 8 (8, 16, 32, 64, 128… look familiar from your SD memory cards?) Hexadecimal has a base of 16, which is easy for a computer to use since 8 + 8 = 16.

Also remember that most visible colors can be reproduced using a mixture of red, green or blue (primary colors) thus we have the RGB groupings.

So “000000” is black and “FFFFFF” is white. In otherwords “000000” has no color and “FFFFFF” has all the color. So what if you want just a little red? Something like “010000” should do it. But what if you want a lot of red? Try “FF0000”. Yellow? “Try “FFFF00”. But this is the basics most of us know.

But where does the alphabet come into play? Can’t seem to get that one position above 9 can you? So use the alphabet to keep adding on top of that 9. So the value of F basically equals a 15 fit into one placeholder. If you want to go to 16 you’d start back at 0 and add a 1 to the previous place holder thus “0F0000” becomes “100000” for that little bit of red.

If this explanation is boring you or just confusing – watch a great short video about this at Nettuts+ .

After I watched this video I now have a clear understanding of what is going on here instead of just winging it via an IDE.