How colour
works Colours are made in much the same way as you would mix a
colour using paint. You take the primary colours of Red, Green and Blue and mix
various amounts of those colours together to create a new colour. Only instead
of using your paint brush to select the amount of paint you use a hexadecimal
number instead.
For those who are not familiar with Hexadecimal it uses
all of our standard numbers ie 0,1,2,3,4,5,6,7,8 & 9, but also includes
A,B,C,D,E & F to allow for more numbers to be created. Effectively the
numbering system goes.
Decimal Value |
0 |
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
Hexadecimal Value |
0 |
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
A |
B |
C |
D |
E |
F | Mixing a colour In HTML we represent a colour
using a six digit hexadecimal number. Please note you must always use the
American spelling of colour, "color".
For example.
color="#22AA33"
This 6 digit number can be further broken into the
primary colours.
- The first two digits relate to how much RED is
to be used in the colour.
- The middle two digits relate to how much GREEN
is to be used in the colour.
- The Last two digits relate to how much BLUE is
to be used in the colour.
The final colour depends on the amount of each of the primary colours you
use. FF will use a lot of the colour, 00 uses none. This is probably best shown
by looking at the colours black and white.
White = #ffffff This
means use all the red, green and blue possible. This will make a very very light
colour, which appears white.
Black = #000000 This means use NO
red, NO green and NO blue. This will make a very very dark colour, which appears
black.
A table of colours and their Hexadecimal numbers.
Colour |
Value |
Colour |
Value |
|
#000000 |
|
#FFFFFF |
|
#FF0000 |
|
#800000 |
|
#00FF00 |
|
#008000 |
|
#0000FF |
|
#000080 |
|
#FFFF00 |
|
#808000 |
|
#FF00FF |
|
#800080 |
|
#00FFFF |
|
#008080 |
|
#FF8080 |
|
#80FF80 |
|
#8080FF |
|
#808080 |
You are here: Home-USEFUL INFO-Webmaster-HTML-Use of Colour
Previous Topic: Text & Formatting Next Topic: Working with images
|