HTML Hexadecimal Numbers
Hexadecimal Numbers are based on a pattern of 16 numbers, as opposed to the numbering system we commonly use which is based on the number 10. This is done to make it easier to understand the numbering system that computers use. Computers use a system which is based on 2. A state is either on or off. This is known as binary. Octal, which is based on the number 8 is also commonly used.
Binary counts to 16 as follows;
0, 1, 10, 11, 110, 111, 1110, 1111, 11110, 11111, 111110, 111111, 1111110, 1111111, 11111110, 11111111, 111111110.
Octal counts to 16 as follows;
0, 1, 2, 3, 4, 5, 6, 7, 10, 11, 12, 13, 14, 15, 16, 17, 20.
Hexadecimal counts to 16 as follows;
0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F.
This may seem confusing, but it simplifies translating our numbering system to that of computers, which is why Hexadecimal is so commonly used. Particularly when you compare it to binary.
In HTML and CSS, Hexadecimal numbering is used in a series of three digits, 2 per color, Red, Green and Blue, or 0-F (In our commonly used numbering system 0-16)
You can also use a system of 256 digits if you prefer. Why 256? Because 16 x 16 = 256! (F x F)
Thus the color black in 256 digits is rendered rgb(0,0,0) ("rgb" stands for Red, Green, Blue) and in hexadecimal #000000
The color pure white would be rendered rgb(255,255,255) and in hexadecimal #FFFFFF
Hopefully you remember how to mix colors from your art class in high school.
So you have 3 ways to change the colors. You can write the color name. You have 140 colors to choose from. Or you can choose one of the numbering systems. The following three code examples all produce the same result, a class called "redText" which colors text red;
Color Name
<style>
.redText{
color: red ;
{
<style>
Hexadecimal Color Number
<style>
.redText{
color: #FF0000 ;
{
<style>
Decimal Color Number
<style>
.redText{
color: rgb(255,0,0) ;
{
<style>
Here is a color table of the possible color values. Some of the values accept different spellings For example "gray"and "grey".
I hope you find a system you prefer. but I suggest once you do, you stick with the same system to avoid future confusion. Personally I prefer the naming system, but I believe the numbering system probably works better if you are looking for greater control over your web site.