About Colour Codes

Defining Colours in HTML

On a computer monitor or TV screen, all the colours you see are produced using a combination of Red, Green, and Blue or RGB. Older monitors are set to recognize 256 colour combintions. You don't need to know the following, but may find it all easier to use if you understand it.

Colours in the HTML world are normally defined using “Hexadecimal” numbers. Hexadecimal numbers are in base 16. The Characters are from 0-F. This is the computer worlds way of counting to 16 with 1 digit. i.e.:..8,9,A,B,C... Hex numbers can define up to 256 values with 2 digits. Just remember: the computer understands on or off, so everything is multiples of 2: 8 bit, 256 colours, etc. And the reason for hex numbers is that they take less memory and processing - less space and time.

For the web environment, there are 216 colours common to the Mac's and PC's sets of 256 colours. Using the full range of Hex numbers will define 16.7 million colours (256 x 256 x 256 - 256 values each of red, green and blue. Also known as 24 bit or true colour). Most but not all monitors are set this high.

Each hex colour number starts with the # symbol and is followed by 6 characters. Each is 3 pairs of 2 numbers representing red, green and blue, i.e.: #rrggbb. The range begins with black at #000000 and ends with white at #FFFFFF. Any set where the 3 pairs are the same is a greyscale colour.

By sticking with pairs of the specific hex numbers 00, 33, 66, 99, CC, and FF, you will stay in the 216 "web safe" arena. For example, #CCFFCC or #990033 above. This is much less of an issue now with modern monitors, but web safe colours still offer the simple, reliable palette.

In CSS, colours are defined in the Style instead, offering much more control. But the same principles and naming conventions hold true.

For example, while #32bfc1 is a nice Aquamarine, any monitors not set to millions of colours will “dither” it to a murky variation.

I have organized a complete Colour Table of Hex values for your reference, on a background of the coded colour. Even if you didn't get any of this, just pick a colour you like and use the # on it in the tag. That's it.

There are many ways to organize colour charts. This is one way. Lynda Weinman's Browser Safe Colour Palette is another. Webmonkeys is another.

Alternative codes:
Keywords
In HTML colour tags, you can use colour “Keywords” such as black, red, yellow, etc. However, unless you simply want to set black or white, the colour range is limited to 16. Using Hexadecimal codes gives you much more control.

RGB
You can also set values with RGB itself, but this is actually more involved.
The format is: rr:gg:bb. In RGB talk, #FFFFFF would be 255:255:255. (not 256 as the count starts with 0) #000000 would be 0:0:0.

If you are used to dealing with RGB numbers, the equivalents are