BBC Home

Explore the BBC

h2g2
27th November 2009
Accessibility help
Text only

Guide ID: A315901 (Edited)

Edited Guide Entry


SEARCH h2g2
Edited Entries only
Search h2g2Advanced Search


New visitors: Create your membership
Returning members: Sign in
BBC Homepage
The Guide to Life, The Universe and Everything.

3. Everything / Maths, Science & Technology / Computers / The Internet
3. Everything / Maths, Science & Technology / Physics / Colours of the Visible Spectrum

Created: 23rd June 2000
Web-safe Colours
Contact Us


Like this page?
Send it to a friend!

 
Computer monitor showing multi-coloured squares

When Isaac Newton first bent light through a prism and generated a rainbow in 1666, he demonstrated the existence of the colour spectrum, composed of six primary colours that we all know from our childhood crayon boxes: red, orange, yellow, green, blue, and violet. Up to then, colour was understood and manipulated solely as a quality of pigment, the element in paint and dyes that gives them their colour. But as a result of Newton's discovery, science learned to talk about two kinds of colour: pigment colour and light colour. This article is about light colour, that is, colour derived from the play of light. The cathode ray tube at the heart of the conventional computer display monitor1 works with light, not pigment.

The Range of Colour

How many colours are there? There are certainly more than the human eye can see. The range of visible colours ends above infrared and below ultraviolet, but the remaining subset is continuous and infinitely divisible. In a range of very similar colours, called a gradient, the eye is quick to discern what digital artists call banding: a visible difference between adjacent shades. This demonstrates that the human eye is capable of exceedingly fine discrimination; and yet there is a subset of colours within the visible range, which the average human eye cannot distinguish at all. These colours are known as the metameric grays. These shades are produced when the balance of red, blue, and green evens out into a colour that the human eye cannot distinguish from grey.

Bit Depth

Windows users have the option to set their displays for 256 colours, 'high colour' (16 bit) or 'true colour' (32 bit). With other operating systems, terms such as 'thousands of colours' or 'millions of colours' may be used. What's being described here is how many bits it takes to specify the colour of each pixel in an image.

The decimal value 255 is #FF in hexadecimal (hex) representation. This (plus 1 for 0, or black) is the maximum value that can be held in 8 bits. Similarly, #FFFF, or 66535 decimal (plus 1 for black), is the maximum value that can be held in 16 bits (2 bytes); and #FFFFFFF (16,777,215) is the maximum (plus 1) for 24 bits (3 bytes). Thus, 'bit depth' determines how many colours are available for display.

Obviously, an image that only requires 8 bits to describe a screen pixel will load faster than one which requires 24 bits. It can be argued that the development of faster computers has been driven by the need for faster screen imagery.

Building Colours

Pure (unfiltered) light is white. You cannot get lighter than white. Conversely, pure black is the complete absence of light. All colours in between white and black are recipes, combinations of the three primary colours, red, green and blue. Describing a colour in terms of its red, green, and blue components is called RGB modelling; but this is not the only way to describe colours. They may also be described by three qualities: hue, saturation, and value (HSV)2. To the human eye, a colour at its maximum value is a colour with no 'dark' in it. Reducing the hex value of a colour is the equivalent of turning down the wattage of the light. The more you reduce the value, the darker the colour gets. Saturation defines the amount of white that is mixed into a colour. A fully saturated colour is one with no white in it. We have the same metaphorical problem with saturation as with value. In fact, as you lose saturation you mix in more 'light'.

Colours are identified as three pairs of hexadecimal digits, one pair for red, green and blue respectively; each colour has a unique numeric value, but the pairs of digits can be considered (and altered) separately as components of the overall colour.

Spectrum colour is quantifiable and can be studied by people who are colour-blind... like Sir Isaac Newton. Colour is also very subjective. A handful of colours have names that have been generally agreed upon; thousands more have names which are obscure to anyone but a specialist; and innumerable others exist but have never been formally named.

One group, which is making a very serious effort to standardise 'digital' colour is the International Colour Consortium, which was founded in 1993,

...by eight industry vendors for the purpose of creating, promoting and encouraging the standardization and evolution of an open, vendor-neutral, cross platform colour management system architecture and components

Among the founding members of ICC are Adobe Systems, Microsoft, Apple, Eastman Kodak, Silicon Graphics and Sun Microsystems. Pantone is another major player in the world of colour matching systems, although their palettes are geared toward pigment based systems (dyeing, printing, plastics). They are, in any case, members in good standing of the ICC, because they are concerned about making sure that pigments match digital design processes.

The Web Safe Palette

Much of the credit has been given to Netscape for the development of a common subset of foreground colours, which can be used on PC's and Apple machines, although colours vary dramatically from monitor to monitor, as a visit to a bank of televisions will demonstrate. But when colours can be depended on to display (more or less) as intended, designers can create web sites with confidence in the consistency of the end result.

The web safe (also called browser safe) palette consists of 216 colours3, each represented numerically. A web safe colour may consist of any of the following values, in any combination of 3 pairs: 00, 33, 66, 99, CC, and FF.

UNIX users rely on a palette which follows the same rules, but uses numeric values composed of #00, #40, #80, #BF or #FF.

What if you use a colour outside the palette, say #AC27F0? The answer is that results are unpredictable. A machine using a limited palette may display a grey, an unexpected colour, or it may attempt to simulate the colour by means of dithering.4

The Basics

  • Pure white - The hex value FFFFFF is the highest number that will fit into the allotted space: three bytes, one each to represent red, green and blue.

  • Black - Black is the complete absence of light and is represented as #000000.

  • Gray - Where red, green, and blue occur in equal amounts, the result is a perfectly neutral shade. The grays can be thought of as darker whites ... or as lighter blacks.

Primary Colours

In each of the primary colours, one pair of digits is at maximum value, while the other two pairs are at zero. This indicates that one component is at its brightest, while the other two components are completely absent.

  • Red is FF0000
  • Green is 00FF00
  • Blue is 0000FF

Secondary Colours

These are also known as additive colours, because they are produced by adding two primary colours together.

  • Cyan is 00FFF, a combination of blue and green.
  • Magenta is FF00FF, a combination of red and blue.
  • Yellow is FFFF00, a combination of Red and Green.

Figuring out the Combinations

Figuring out the combinations of RBG in order to produce the colour you want is pretty simple, once you've learned the basic seven and once you understand value and saturation. If 0000FF is pure blue and 00FFFF is pure cyan, then 0033FF, 0066FF, and 0099FF are the web safe shades of blue in between.

How would I get from green (00FF00) to magenta (FF00FF)? This is an interesting trip, because the two colours actually cancel each other out halfway! Since the web safe set is only a subset, we jump over the shade that is exactly halfway between and come up with two silvery shades of purple and green respectively.


1 For the purposes of this entry, flat LCD monitors will be understood to handle colour the same way as raster based monitors.
2 As with so much else in the subjective world of colour theory, the Hue-Saturation-Value descriptor is also popularly called Hue, Luminance and Saturation (HLS).
3 According to Macromedia Inc, four of these colours are not rendered correctly by Windows Internet Explorer: #0033FF, #3300FF, #00FF33, and #33FF00.
4 Seurat dithered! Dithering applies two colours in a pattern of dots to replicate a third colour.


Clip/Bookmark this page
This article has not been bookmarked.
ENTRY DATA
Written and Researched by:

Asteroid Lil

Edited by:

John the gardener says, "Free Tibet!"

Referenced Entries:

Rainbow



CONVERSATION TOPICS FOR THIS ENTRY:

Start a new conversation

People have been talking about this Guide Entry. Here are the most recent Conversations:

TITLE
LATEST POST
Web Safe ColoursMar 14, 2003
CYMKMay 6, 2002
See them here...Sep 3, 2001
Not primary coloursJun 28, 2000
Not true! (colour)Jun 26, 2000
Figuring out the combinationsJun 25, 2000
I'm Ignorant...Jun 25, 2000




Disclaimer

Most of the content on h2g2 is created by h2g2's Researchers, who are members of the public. The views expressed are theirs and unless specifically stated are not those of the BBC. The BBC is not responsible for the content of any external sites referenced. In the event that you consider anything on this page to be in breach of the site's House Rules, please click here. For any other comments, please start a Conversation above.




About the BBC | Help | Terms of Use | Privacy & Cookies Policy