Here are some
examples of
|
matched suites of
|
web-safe colours
|
for text & background
|
There are many ways of structuring a natural sequence of
tones.
In these examples I chose to start with a basic deep colour, and
then lighten it step by step, where each step followed a consistent
pattern, keeping the same proportions as I moved up the scale.
Remember that the quantities
we have to play with for each color are
- 00, 33, 66, 99, CC, FF
For example, if we start with 003366, each value might move
up one step, so the next would be 336699 - 6699CC - 99CCFF .
To allow a 'gap' for contrast between background and text, you might
need one more
- by extension, "CCFFII",
which doesn't exist of course...
in which case you would have to 'cheat' with CCFFFF.
|
MMMMMM
|
MMMMMM
|
MMMMMM
|
MMMMMM
|
MMMMMM
|
|
003366
|
336699
|
6699CC
|
99CCFF
|
CCFFFF
|
Another pattern would be to keep one colour at zero, like this -
|
MMMMMM
|
MMMMMM
|
MMMMMM
|
MMMMMM
|
MMMMMM
|
|
000033
|
003366
|
006699
|
0099CC
|
00CCFF
|
I've used the greatest contrast between the basic text and the
background: the visited and unvisited links are nearest the basic
text: and the tone nearest the background I haven't used, to make a
better contrast... Since it's available, you might think of using it
for the active link - the one which shows while you hold the mouse
down - but it can be worth having a real contrast for that one, so
people know their click is having an effect...
The practicalities are different, depending
what you are using to select your colors...
David Kettlewell