How to Register a Domain Name for Your HTML5 and CSS3 Site
How to Use IrfanView’s Built-In Effects for HTML5 and CSS3 Programming
10 Stellar Web Resources for HTML5 and CSS3

How to Use the Web-Safe Color Palette for Your HTML5 and CSS3 Based Web Pages

A long time ago, browsers couldn't even agree on what colors they'd display reliably. HTML5 and CSS3 web developers responded by working within a predefined palette of colors that worked pretty much the same on every browser. Today's browsers have no problems showing lots of colors, but the so-called web-safe color palette is still sometimes used because it's an easy starting point.

The primary colors are all made of 0s and Fs: #FF0000is red (all red, no green, no blue). A web-safe color uses any combination of these values, so is web-safe, but is not.

Description Red Green Blue
Very bright FF FF FF
99 99 99
66 66 66
33 33 33
Very dark 00 00 00

To pick a web-safe value from this chart, determine how much of each color you want. A bright red will have red turned on all the way (FF) with no green (00) and no blue (00), making #FF0000. If you want a darker red, you might turn the red down a little. The next darker web-safe red is #CC0000. If that isn’t dark enough, you might try #990000.

Say you like that, but you want it a little purple. Simply add a notch or two of blue: #990033 or #990066.


The original problem web-safe colors were designed to alleviate is long resolved, but they're still popular as a starting point. Web-safe colors give you a dispersed and easily understood subset of colors you can start with. You don't have to stay there, but it's a great place to start.

  • Add a Comment
  • Print
  • Share
blog comments powered by Disqus
Understand the Role of CSS
How to Control Text Blocks in HTML5
How to Add Audio to Your HTML5 and CSS3 Based Web Pages
How to Use the Clear Attribute to Control Page Layout for HTML5 and CSS3 Programming
How to Use IrfanView to Process Image Batches for HTML5 and CSS3 Programming