HTML Color Codes for the Complete Idiot

HTML Tutorials for the Complete Idiot
Has Relocated to a New Domain!
MyHTMLTutorials.com

Please make changes to any of your links/favorites to point this new location.

You will automatically be redirected to the new site in 10 seconds.

HTML Color Codes
What are these HTML Color Codes?
HTML Tutorials
By Jeff Walters

Red, Green, and Blue (RGB):

HTML color codes are somewhat of a mystery to most people. The colors are expressed as Red, Green, and Blue (RGB), where each color has a value of 0 to 255 expressed in hexadecimal notation. Confused yet?

Ok, lets take it a step at a time. Look at the first part of the sentence in bold. All colors can be expressed in terms of their red, green, and blue (RGB) content. The intensity of these colors can range from a value of 0 to 255 (0 being the minimum, and 255 the maximum). For example:

255,0,0 is Bright Red.
0,255,0 is Bright Green.
0,0,255 is Bright Blue.
0,0,0 is Black.
I cant show white on this background, but it's 255,255,255.

There are several other combinations you can make such as:

50,110,0 is a Dark Green.
120,0,90 is a Dark Purple .

Hexadecimal Notation:

Here comes the hard part. The six digit hexadecimal color code is made up of three parts. The first two digits of the color code represent the hexadecimal value for red. The second two digits represent the hexadecimal value for green and the last two digits represent the hexadecimal value for blue.

COLOR="#RR GG BB"

Now, how do you get the hexadecimal values of red, green, and blue from the three 0 to 255 numbers? That's usually the hard part. Fortunately, there are shareware programs you can get from the Web which can do this for you.

I don't want to try to explain the conversion, but I will explain why there are letters as well as numbers. The hexadecimal system is represented by the following in increasing order.

0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F (16 total)

They basically represent 0 through 15, where the letters A though F are used to represent numbers 10 through 15 as a single digit. Pretty strange, hu? Two digit hexadecimal counting looks like this.

37, 38, 39, 3A, 3B, 3C, 3D, 3E, 3F, 40, 41, 42, 43, 44,
45, 46, 47, 48, 49, 4A, 4B, 4C, 4D, 4E, 4F, 50, 51, 52

Relative Color Changes:

This section should show you how to adjust your HTML color codes. Lets take the following text font color as an example.

COLOR="#A10000"

Now, suppose we want to increase the red content of the color just a little. To do this we would increase the 1 up to a 5, 9, or maybe even an F. The results are as follows.

COLOR="#A50000"
COLOR="#A90000"
COLOR="#AF0000"

The change is too small, you say? There is a difference in the colors, but not much. Now, let us change the red in a more dramatic way. Let us change the A to a B, D, and F. The results are shown below.

COLOR="#B10000"
COLOR="#D10000"
COLOR="#F10000"

HTML color codes are easy to look at once you break them down. Now you can see the difference, I'm sure. By changing the first digit, you are making a change that is 16 times as much as a second digit change. The same concept also applies to both green and blue. Have fun creating colors!