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...

a simple text editor
and viewing the result in a browser

a colour wheel

Mac OS8

a gadget that shows you colours if you type in numbers,
and gives you numbers if you select colors on the screen

LIKE TO KNOW MORE? - CONTENTS

BACK TO TEMPLATES MAIN PAGE

David Kettlewell

web-sites
e-mail

Institute of Baltic Studies - Tartu - Estonia