The colour wheel below consists of 20 basic web safe colours, and is a helpful tool that shows the basic organization and relationships between colours. By choosing the colour opposite a particular colour you can match colours more effectively; or by choosing colours at 90 degree angles you can match four colours more effectively.
To reproduce these basic web safe colours for a page background or text combination the hexadecimal numbers which the web browser uses are shown below, if you wish to reproduce these colours in a graphics program, the RGB (red, green and blue) values are also shown below.
| Hexadecimal - Browser Colour Codes | |||
| 1 - #FF0000 | 6 - #FFFF00 | 11 - #009900 | 16 - #0000FF |
| 2 - #FF3300 | 7 - #CCFF00 | 12 - #006633 | 17 - #3300CC |
| 3 - #FF6600 | 8 - #99CC00 | 13 - #006666 | 18 - #660099 |
| 4 - #FF9900 | 9 - #66CC00 | 14 - #003399 | 19 - #990066 |
| 5 - #FFCC00 | 10 - #339900 | 15 - #0033CC | 20 - #CC0033 |
| Red, Green and Blue Values |
| 1 - R:255 G:000 B:000 |
| 2 - R:255 G:051 B:000 |
| 3 - R:255 G:102 B:000 |
| 4 - R:255 G:153 B:000 |
| 5 - R:255 G:204 B:000 |
| 6 - R:255 G:255 B:000 |
| 7 - R:204 G:255 B:000 |
| 8 - R:153 G:204 B:000 |
| 9 - R:102 G:204 B:000 |
| 10 - R:051 G:204 B:000 |
| 12 - R:000 G:102 B:051 |
| 13 - R:000 G:102 B:102 |
| 14 - R:000 G:051 B:153 |
| 15 - R:000 G:051 B:204 |
| 16 - R:000 G:000 B:255 |
| 17 - R:051 G:000 B:204 |
| 11 - R:000 G:153 B:000 |
| 18 - R:102 G:000 B:153 |
| 19 - R:153 G:000 B:102 |
| 20 - R:204 G:00 B:051 |
Related Articles
- Colour TheoryThe colour wheel below consists of 20 basic web safe colours, and is a helpful tool that shows the basic organization and relationships between colours. By choosing the colour opposite a particular colour you can match colours more effectively...
- Designing for ClarityOnce you have your content, arranged it into a likely architecture, and worked out where it will sit on the page, youre ready to design the display layer. The goal is to arrange various elements on screen to maximise the users chance of using the site successfully...
- Color Theory 101You may never think about color when you design. You may just think what looks good is what is good. Well think again, because it goes much deeper than that. This week I want to begin talking about color theory. Before I do, I want to stress that some of this is hard and true Color Theory as
- Web Colour CombinationsWhat colour combination should I use in my website and how it will help your visitors on the long run.
- Color Adjustments: Color Theory (Video Included)Lets proceed to the color adjustments. To work with color efficiently you have to understand the foundations of the color separation. If you know this theory, feel free to skip this page. If you dont, please read this at least once.
- Guidelines for Using ColourColour is one of the designers best tools. There are lots of ways to use it to help communicate a message. Colour can carry meaning, express personality, differentiate, frame, and highlight content...
- Colour ManagementThis interesting article on Web Design is about Color Management. The author discusses color theory, then applies it to graphics and monitor displays in a very helpful tutorial with lots of screenshots.
- Search Engine Secrets1. Search engines read your pages from the top down.
So, you want to use your critical keywords at least once in the first paragraph on each web page. Then you can use it once in each paragraph after that and in the last line... - Web Safe ColoursWeb Safe A web safe colour is one that will display correctly on any screen, irrespective of the operating system or graphics card. There are only 216 web safe colours. You can use other colours, but you cannot be sure they will display correctly. A general rule of thumb is: if possible use
- Search Engine Optimization For GoogleA group of Google employees have recently filed a patent application (#20050071741) with the United States Patent and Trademark Office which gives insight into how to optimize one