HTML 011 - Colors
PDF

So far in all of the tutorials we have gone over background colors and text colors but I have not told you all of the different colors you can use. There are three ways to define a color in HTML. The first way and the only way we have used so far have been with one of the presets. There are only 16 of those: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow.

This is an excruciatingly limited list of colors. Let’s expand it to 16,777,216, over a million times more choices! There are two ways use that amount and you can either use the RGB values or you can use the hex decimal values. To do the hex decimal you would do something like this:

<html>
<head>
<title>My Web Page</title>
</head>
<body bgcolor="#123456">
</body>
</html>

A hex decimal color must always have six numbers or letters following the # symbol. The color above will be a dark blue color. For each of the six decimals you can use 0 through 9 and A through F. Black is #000000 and White is #FFFFFF. F is higher than A, 9 is higher than 0, and A is higher than 9. The order from lowest to highest looks like this: 0123456789ABCDEF. The hex numbers work in a similar way to RGB values in the fact that the first two decimals is the red value, the second two are the green and the last two are the blue. So:

#FF0000 = Red
#00FF00 = Green
#0000FF = Blue

The other way to make HTML colors is to use the actual RGB values rather than having to convert them into hex decimal. To do this your coding will look something like this:

rgb(255,255,255) = White
rgb(0,0,0) = Black

However, this is not very popular and does not work correctly on all web browsers. I highly suggest not even using it and sticking to the Hex decimal values. If you need to convert an RGB value into hex decimal there is a way to do it.

If you have the calculator that comes with Windows it is very easy to convert. All you have to do is open up the calculator, get into scientific view and make sure the Dec radio button is chosen. This stands for decimal. When you have entered the 0-255 rgb value click the Hex radio button and your value will be converted. You will have to do this for all three of the rgb values if they are different.

From what I have found, if you are on a Mac you can do this on the calculator it comes with as well. Just type one of the three numbers in the calculator and then hit the HX button. This will convert the rgb value into the Hex value. As I said above, you will have to do this for all three of the rgb values.