- Colors in HTML
- Web Safe Colors
- Below are six tables showing all of the 216 «web safe» colors, just to show you a range of colors compared to their hex values.
- Web Safe Colors
- What is Web Safe
- Why Only 216 Colors?
- Web Safe Color Palette
- Related
- Web Safe Color Code Chart
- These Are Not The Only Colors
- What is a Hex Code?
- Are Web Safe Colors Still Relevant?
- 216 HTML Color Chart
- Web safe colors in html
- 2. It is no longer necessary to limit your palette to web safe colors 😅
- 3. CSS and HTML allow for 16.777216 million colors. Use them! 🎉
- You made it! What’s next?
Colors in HTML
Color numbers are specified using hexadecimal (base 16) values.
The hexidecimal digits are: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F
(where A through F equal the base 10 numbers: 10, 11, 12, 13, 14, 15)
The six digit color number is broken into three groups of two digits which specify the amount of Red, Green, and Blue in the color (using additive color. the way colored lights mix, not the way color pigments mix). Each two digit hex pair can have a value from 00 to FF (FF=256 in base 10). This gives over 16 million possible colors.
# FF 00 00 means FF worth of Red, and no Green or Blue. The result is RED .
# 00 00 FF means no Red or Green, and FF worth of Blue. The result is BLUE .
# FF FF 00 means FF worth of Red and Green, and Blue. The result is YELLOW .
# 00 00 00 means no Red, Green, or Blue. The result is BLACK .
# FF FF FF means full FF amounts of Red, Green, and Blue. The result is WHITE .
# FF EF D5 has high values for all colors, giving a light result: PAPAYAWHIP .
(no, I don’t know who thought up the color names.)
# 55 6B 2F has lower values for all colors, giving a darker result: DARKOLIVEGREEN .
Note that is is OK to use either uppercase or lowercase letters for the base-16 digits A, B, C, D, E, F.
HTML also recognizes color numbers that contain just three hexidecimal digits. This is a shortcut for colors where the red, green, and blue values consist of two identical digits. Example:
# 0 0 F is the same as: # 00 00 FF and is BLUE .
# F F 0 is the same as: # FF FF 00 and is YELLOW .
# 6 B 5 is the same as: # 66 BB 55 and is THIS COLOR .
# 0 0 0 is BLACK . # F F F is WHITE .
# 6 6 6 is a DARK GRAY . # A A A is a light LIGHT GRAY .
NOTE! Always remember to put in the # symbol when specifying color numbers. Older versions of HTML didn’t care if you left it out, but some browsers are stricter about this, and f you forget the # sign the browser may not display the color you requested.
Web Safe Colors
Nowadays, computers/monitors can display thousands or millions of colors, so the concept of «Web safe colors» is no longer important. But years ago, many computers were limited to displaying «8-bit color» and could only show 256 possible colors. Even worse, different computer systems (PC, Mac, UNIX workstations) don’t even use the same 256 colors in their «color palettes,» so you couldn’t be sure what your color will be shifted to.
To avoid problems for older machines and different system color palettes, early Web designers usually limited their color choices to the 216 «web safe colors» which would display more or less the same on all systems. The web safe colors use only the hex values 00, 33, 66, 99, CC, and FF when making color combinations.
Of the examples shown earlier,
# FF EF D5 ( PAPAYAWHIP ) and
# 55 6B 2F ( DARKOLIVEGREEN )
. are not web safe colors. They would get shifted to
# FF FF CC ( NOT PAPAYAWHIP ) and
# 66 66 33 ( NOT DARKOLIVEGREEN )
Below are six tables showing all of the 216 «web safe» colors, just to show you a range of colors compared to their hex values.
Within each table, red increases from left to right, and green increases from top to bottom, in steps of 33 (hex).
Blue increases from the first table to the last, in steps of 33 (hex).
| #000000 | #330000 | #660000 | #990000 | #CC0000 | #FF0000 |
| #003300 | #333300 | #663300 | #993300 | #CC3300 | #FF3300 |
| #006600 | #336600 | #666600 | #996600 | #CC6600 | #FF6600 |
| #009900 | #339900 | #669900 | #999900 | #CC9900 | #FF9900 |
| #00CC00 | #33CC00 | #66CC00 | #99CC00 | #CCCC00 | #FFCC00 |
| #00FF00 | #33FF00 | #66FF00 | #99FF00 | #CCFF00 | #FFFF00 |
| #000033 | #330033 | #660033 | #990033 | #CC0033 | #FF0033 |
| #003333 | #333333 | #663333 | #993333 | #CC3333 | #FF3333 |
| #006633 | #336633 | #666633 | #996633 | #CC6633 | #FF6633 |
| #009933 | #339933 | #669933 | #999933 | #CC9933 | #FF9933 |
| #00CC33 | #33CC33 | #66CC33 | #99CC33 | #CCCC33 | #FFCC33 |
| #00FF33 | #33FF33 | #66FF33 | #99FF33 | #CCFF33 | #FFFF33 |
| #000066 | #330066 | #660066 | #990066 | #CC0066 | #FF0066 |
| #003366 | #333366 | #663366 | #993366 | #CC3366 | #FF3366 |
| #006666 | #336666 | #666666 | #996666 | #CC6666 | #FF6666 |
| #009966 | #339966 | #669966 | #999966 | #CC9966 | #FF9966 |
| #00CC66 | #33CC66 | #66CC66 | #99CC66 | #CCCC66 | #FFCC66 |
| #00FF66 | #33FF66 | #66FF66 | #99FF66 | #CCFF66 | #FFFF66 |
| #000099 | #330099 | #660099 | #990099 | #CC0099 | #FF0099 |
| #003399 | #333399 | #663399 | #993399 | #CC3399 | #FF3399 |
| #006699 | #336699 | #666699 | #996699 | #CC6699 | #FF6699 |
| #009999 | #339999 | #669999 | #999999 | #CC9999 | #FF9999 |
| #00CC99 | #33CC99 | #66CC99 | #99CC99 | #CCCC99 | #FFCC99 |
| #00FF99 | #33FF99 | #66FF99 | #99FF99 | #CCFF99 | #FFFF99 |
| #0000CC | #3300CC | #6600CC | #9900CC | #CC00CC | #FF00CC |
| #0033CC | #3333CC | #6633CC | #9933CC | #CC33CC | #FF33CC |
| #0066CC | #3366CC | #6666CC | #9966CC | #CC66CC | #FF66CC |
| #0099CC | #3399CC | #6699CC | #9999CC | #CC99CC | #FF99CC |
| #00CCCC | #33CCCC | #66CCCC | #99CCCC | #CCCCCC | #FFCCCC |
| #00FFCC | #33FFCC | #66FFCC | #99FFCC | #CCFFCC | #FFFFCC |
| #0000FF | #3300FF | #6600FF | #9900FF | #CC00FF | #FF00FF |
| #0033FF | #3333FF | #6633FF | #9933FF | #CC33FF | #FF33FF |
| #0066FF | #3366FF | #6666FF | #9966FF | #CC66FF | #FF66FF |
| #0099FF | #3399FF | #6699FF | #9999FF | #CC99FF | #FF99FF |
| #00CCFF | #33CCFF | #66CCFF | #99CCFF | #CCCCFF | #FFCCFF |
| #00FFFF | #33FFFF | #66FFFF | #99FF9FF | #CCFFFF | #FFFFFF |
Web Safe Colors
Web safe colors are colors that belong to a color palette that was designed to be «web safe». The web safe palette is not as relevant as it once was, due to the advancement of technology, however, it’s still played a significant part in the development of the web.
What is Web Safe
In this context, the term «web safe» simply refers to colors that will look the same on any computer. When writing HTML, web developers can choose any color they like using the hex color codes, but in the early days of the web, most of these colors would look different, depending on the computer that the website visitor was using. Back in the early days of the web, most computers could only display 256 colors. Some could display more but, most colors looked different, depending on which computer you were viewing it on. Many web designers were horrified when they found out what their slick and colorful website looked like in another browser or operating system. Often, the colors would dither and basically look really bad.
That’s why the web safe color palette was created. To ensure that when a web designer established the color scheme for a website, that those colors would look the same on all browsers and operating systems.
Why Only 216 Colors?
The web safe color palette contains 216 colors. Back in the early days of the web, most computers only had 8-bit video cards. Therefore, they could only view 256 colors. Out of those 256 colors, 40 of them looked different between Macs and PCs. The reason that the web safe color palette only has 216 colors is because of those 40 colors. Limiting the palette to 216 ensures that both Macs and PCs display all colors the same.
Web safe color palette is/was also referred to as browser-safe palette, Netscape palette, 216 palette, web palette, and the 6x6x6 color cube.
Web Safe Color Palette
If you prefer to use only web safe colors in your color scheme, here’s the web safe palette.
Related
Web Safe Color Code Chart
In web development, it is nice to know what is a web safe color. With different operating systems and internet browsers. There are 216 colors that are considered safe colors to use in your site’s design.
These colors are visible on all the different operating systems. By picking one of these colors for your site. You won’t have to worry about your visitor not seeing the correct color palette of your design.
These Are Not The Only Colors
These colors are not written in stone. There is nothing that says you have to use these colors. There are 16,777,216 colors visible on a standard computer monitor.
The web safe colors are almost guaranteed to be in all operating systems. This gives you the best chance when your page is rendered in your internet browser.
If you are worried about a color that you have that is not on the chart. You can always safely use it as a background image with the repeat property.
What is a Hex Code?
You will notice that a lot of colors are assigned by numbers. These are hex triplet, which is a six digit number. The numbers are represented from zero to F. Which is confusing as 0 is the lowest and F is the highest.
The numeric order would look like this:
0 — 1 — 2 — 3 — 4 — 5 — 6 -7 — 8 — 9 — A — B — C -D -E -F
Each group of two digits will represent how much of red, green, and blue. The first two digits is red, second two green, and the last two is blue.
#FF0000 is red, because there is max of red, with no green or blue.
#FFFFFF this will result in white as all values are maxed out.
#000000 would result in black as all values are zero.
Are Web Safe Colors Still Relevant?
As it is important to know what colors you are working with, using web safe colors are becoming less or a concern when design your page. As of the time of this writing most devices, mobile and desktop, now use a 24 bit colored monitor, which is more than enough to produce any color combination.
216 HTML Color Chart
| #FFFFFF | #FFCCFF | #FF99FF | #FF66FF | #FF33FF | #FF00FF |
| #FFFFCC | #FFCCCC | #FF99CC | #FF66CC | #FF33CC | #FF00CC |
| #FFFF99 | #FFCC99 | #FF9999 | #FF6699 | #FF3399 | #FF0099 |
| #FFFF66 | #FFCC66 | #FF9966 | #FF6666 | #FF3366 | #FF0066 |
| #FFFF33 | #FFCC33 | #FF9933 | #FF6633 | #FF3333 | #FF0033 |
| #FFFF00 | #FFCC00 | #FF9900 | #FF6600 | #FF3300 | #FF0000 |
| #CCFFFF | #CCCCFF | #CC99FF | #CC66FF | #CC33FF | #CC00FF |
| #CCFFCC | #CCCCCC | #CC99CC | #CC66CC | #CC33CC | #CC00CC |
| #CCFF99 | #CCCC99 | #CC9999 | #CC6699 | #CC3399 | #CC0099 |
| #CCFF66 | #CCCC66 | #CC9966 | #CC6666 | #CC3366 | #CC0066 |
| #CCFF33 | #CCCC33 | #CC9933 | #CC6633 | #CC3333 | #CC0033 |
| #CCFF00 | #CCCC00 | #CC9900 | #CC6600 | #CC3300 | #CC0000 |
| #99FFFF | #99CCFF | #9999FF | #9966FF | #9933FF | #9900FF |
| #99FFCC | #99CCCC | #9999CC | #9966CC | #9933CC | #9900CC |
| #99FF99 | #99CC99 | #999999 | #996699 | #993399 | #990099 |
| #99FF66 | #99CC66 | #999966 | #996666 | #993366 | #990066 |
| #99FF33 | #99CC33 | #999933 | #996633 | #993333 | #990033 |
| #99FF00 | #99CC00 | #999900 | #996600 | #993300 | #990000 |
| #66FFFF | #66CCFF | #6699FF | #6666FF | #6633FF | #6600FF |
| #66FFCC | #66CCCC | #6699CC | #6666CC | #6633CC | #6600CC |
| #66FF99 | #66CC99 | #669999 | #666699 | #663399 | #660099 |
| #66FF66 | #66CC66 | #669966 | #666666 | #663366 | #660066 |
| #66FF33 | #66CC33 | #669933 | #666633 | #663333 | #660033 |
| #66FF00 | #66CC00 | #669900 | #666600 | #663300 | #660000 |
| #33FFFF | #33CCFF | #3399FF | #3366FF | #3333FF | #3300FF |
| #33FFCC | #33CCCC | #3399CC | #3366CC | #3333CC | #3300CC |
| #33FF99 | #33CC99 | #339999 | #336699 | #333399 | #330099 |
| #33FF66 | #33CC66 | #339966 | #336666 | #333366 | #330066 |
| #33FF33 | #33CC33 | #339933 | #336633 | #333333 | #330033 |
| #33FF00 | #33CC00 | #339900 | #336600 | #333300 | #330000 |
| #00FFFF | #00CCFF | #0099FF | #0066FF | #0033FF | #0000FF |
| #00FFCC | #00CCCC | #0099CC | #0066CC | #0033CC | #0000CC |
| #00FF99 | #00CC99 | #009999 | #006699 | #003399 | #000099 |
| #00FF66 | #00CC66 | #009966 | #006666 | #003366 | #000066 |
| #00FF33 | #00CC33 | #009933 | #006633 | #003333 | #000033 |
| #00FF00 | #00CC00 | #009900 | #006600 | #003300 | #000000 |
Web safe colors in html
a. The name «web safe colors» implies that there is some standardized set of colors accepted as «safe» for use on the web, but this is not true.
b. The 216 web safe colors presented on this website are more of an informal standard, selected because they were supported by the majority of popular web browsers and operating systems at the time when computer displays were limited to 256 colors.
c. Only 216 of the 256 colors available on early PCs were considered to have consistent enough support across platforms to become part of this informal standard.
2. It is no longer necessary to limit your palette to web safe colors 😅
a. As described above, web safe colors were concieved when the majority of computers only supported 256 colors.
b. Computers today support millions of colors. Monitors, operating systems, and software don’t always display each of these colors in the exact same manner, but the color representations are similar enough for most situations. More specifically.
3. CSS and HTML allow for 16.777216 million colors. Use them! 🎉
a. Today, most web designers specify colors in rgb hexadecimal notation, conventionally called hex notation or rgb decimal notation, conventionally called rgb notation. The color black, for example, can be represented as #FFFFFF in hex notation or rgb(255,255,255) in rgb notation. Colors can also be specified with hsl notation (hue, saturation, lightness) but this is not used as frequently.
b. A web designer can specify 256 shades of red, 256 shades of green, and 256 shades of blue which, when combined, allow for 256^3 (16,777,216) colors. In most cases, there is no reason to limit yourself to the 216 web safe colors since modern systems support and render these approx. 16 million colors in a relativly similar manner (although not in exactly the same manner!).
You made it! What’s next?
To learn even more, read our faq. To view a list of the 216 colors generally considered web safe, explore our color chart.