First time visitor? The tutorials start here.

xHTML and CSS Glossary – Hex Color Codes

Hex color codes may also be referred to simply as, “hex codes.”

Hex codes consist of a number sign (#) followed by 6 characters, or 3 characters if you’re using hex code shorthand. For now, let’s concentrate on the 6-character variety.

Each of the 6 characters must range from 0-9 or a-f. 0 is the absence of a color, while f is as much of a color as you can get. Just think of “f” as “full,” as in “full of color.”

With the 6 characters, the first two define how much red to mix in, the 2nd two how much green to mix in, and the last two how much blue to mix in. #000000 is the absence of color (black), while you can think of #ffffff as full color (white).

#ff0000, #cc0000, and #990000 are all red, with #ff0000 being the brightest red, #cc0000 being a little deeper red, and #990000 being even deeper.

#00ff00, #00cc00, and #009900 are all green, with #00ff00 being the brightest green, #00cc00 being a deeper green, etc.

#0000ff, #0000cc, and #000099 are all blue, with #0000ff being the brightest blue, etc., etc., etc.

#ffeeee is extremely close to #ffffff (white), but is lacking a little bit of green and blue, while it is full of red. This results in a very pale pink.

I keep using characters in pairs here, but #fecd09 is a valid hex code, as is #0c9d3e. You can put any combination of characters in there as long as they consist of numbers and/or the letters a-f.

Now for a note on hex code shorthand, which you never have to use if you don’t want to. You can only use it if the 6-character version consists of 3 pairs, such as the examples I kept giving above. #f00 is the same as #ff0000, and #690 is the same as #669900, but there is no way to shorten, for example, #f9c03d or even #ff0001.

If you found this article useful, please spread the word:
Stumble it! Digg! Tweet it!

Questions or comments?

Please log in to post a comment. Sorry, but it prevents this from happening. If you're not registered yet, you can register here.