Hex Color Codes

So you're working on a web design project and your colleague has just asked you to "send me the hex color codes". You reply "OK - no problem". You think "What on earth are hex color codes?".

Well, "hex color codes" is another way of saying "hexidecimal color codes". The format is a hash (#) followed by 6 numbers or letters. The position of the numbers/letters correlate to the RGB value. For example, #0000ff translates into Red:000, Green:000, Blue:255.

When coding HTML, you often need to specify what color an element should be. For example, the color of text, the background color of a table cell etc. You can either provide a color name (i.e. blue) or the hexadecimal value (#0000ff). Using hex color codes, you have many more options for different shades of color. Instead of just "blue" you can nominate a specific shade of blue using a hexadecimal value.

For example, here are just a few different shades of blue that you could specify:

If you're ever presented with the RGB value of a color, you will be able to determine the hex color code. The easiest way to do this is to use this color code picker. This color picker enables you to view the hex and RGB values of any color. If you have an image editor such as Photoshop, this color picker will be familiar.

Counting in Hexadecimal

Hexadecimal can be a little difficult to understand at first. This is because most of us are used to counting in decimal. When using decimal, we count from 0 to 10, then once we reach 10, we just go from 0 to 10 again but prefix with a 1 (i.e. 10,11,12,13...).

On the other hand, if we were to count using Hexadecimal, we would go from 1 to 16, then start again. Using Hexadecimal, once we go past 10 we add a letter. For example: 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F.

This is why most hexadecimal values include a combination of letters and digits.