Webセーフカラー
Webセーフカラー(Web safe colors)とは、1994年にNetscape Communications社が提案した、216色からなる色の集合のことで、当時、同社の開発するWebブラウザのNetscape Navigatorにおいて、OSやコンピュータの性能の違いに左右されず、どんな環境でもこれらの216色が表示できることを保証しました。今では、Netscape Navigatorに限らず、古い携帯端末のUAに多くあった256色環境においても再現される色として、216色のセーフカラーが広く浸透し利用されています。
セーフカラー使用の是非は?
216色のセーフカラーは、R（赤）,G（緑）,B（青）の光の三原色を6段階に分けて定義したものです。6段階とは、"0" から "255" までの 256段階の階調を "51" ずつ増やしていった "0, 51, 102, 153, 204, 255" からなります。"51" は、16進数で言う "33"、パーセンテージによる割合で "20%" にあたる数です。
つまり、Webセーフカラーとは、R・G・B の各値を "0%" から "20%" ずつ上げていった値の組み合わせで作られています。この6段階の階調が、R・G・B の3色それぞれにあるので、"6×6×6 = 216色"ということになります。
コンピュータがウェブページに指定されている色のすべてを表現できるかどうかの同時発色数は、VRAM（ビデオメモリ）の容量に左右されます。VRAMの容量が少なくて同時発色数に制限がある場合、UAが自動的に近い色に置き換えるカラーシフトが起ったり、製作者の意図した色を再現できないことがあります。
しかし現在では、コンピュータの機能も大きく向上し、65,536色（16ビット）、16,777,216万色（24ビットまたは32ビット）の表現が可能な環境をもったユーザが標準的になりました。そのため、Webセーフカラーはサイト内全体に共通するデザインなど再現できないと困るような重要な部分において使用する程度の配慮で、実際には216色という制限にとらわれる必要はなく、多彩な色の表現をおこなうと良いでしょう。
Webセーフカラー一覧表
| R=FF基準 |
|---|
| #FFFFFF |
| #FFFFCC |
| #FFFF99 |
| #FFFF66 |
| #FFFF33 |
| #FFFF00 |
| #FFCCFF |
| #FFCCCC |
| #FFCC99 |
| #FFCC66 |
| #FFCC33 |
| #FFCC00 |
| #FF99FF |
| #FF99CC |
| #FF9999 |
| #FF9966 |
| #FF9933 |
| #FF9900 |
| #FF66FF |
| #FF66CC |
| #FF6699 |
| #FF6666 |
| #FF6633 |
| #FF6600 |
| #FF33FF |
| #FF33CC |
| #FF3399 |
| #FF3366 |
| #FF3333 |
| #FF3300 |
| #FF00FF |
| #FF00CC |
| #FF0099 |
| #FF0066 |
| #FF0033 |
| #FF0000 |
| R=CC基準 |
|---|
| #CCFFFF |
| #CCFFCC |
| #CCFF99 |
| #CCFF66 |
| #CCFF33 |
| #CCFF00 |
| #CCCCFF |
| #CCCCCC |
| #CCCC99 |
| #CCCC66 |
| #CCCC33 |
| #CCCC00 |
| #CC99FF |
| #CC99CC |
| #CC9999 |
| #CC9966 |
| #CC9933 |
| #CC9900 |
| #CC66FF |
| #CC66CC |
| #CC6699 |
| #CC6666 |
| #CC6633 |
| #CC6600 |
| #CC33FF |
| #CC33CC |
| #CC3399 |
| #CC3366 |
| #CC3333 |
| #CC3300 |
| #CC00FF |
| #CC00CC |
| #CC0099 |
| #CC0066 |
| #CC0033 |
| #CC0000 |
| R=99基準 |
|---|
| #99FFFF |
| #99FFCC |
| #99FF99 |
| #99FF66 |
| #99FF33 |
| #99FF00 |
| #99CCFF |
| #99CCCC |
| #99CC99 |
| #99CC66 |
| #99CC33 |
| #99CC00 |
| #9999FF |
| #9999CC |
| #999999 |
| #999966 |
| #999933 |
| #999900 |
| #9966FF |
| #9966CC |
| #996699 |
| #996666 |
| #996633 |
| #996600 |
| #9933FF |
| #9933CC |
| #993399 |
| #993366 |
| #993333 |
| #993300 |
| #9900FF |
| #9900CC |
| #990099 |
| #990066 |
| #990033 |
| #990000 |
| R=66基準 |
|---|
| #66FFFF |
| #66FFCC |
| #66FF99 |
| #66FF66 |
| #66FF33 |
| #66FF00 |
| #66CCFF |
| #66CCCC |
| #66CC99 |
| #66CC66 |
| #66CC33 |
| #66CC00 |
| #6699FF |
| #6699CC |
| #669999 |
| #669966 |
| #669933 |
| #669900 |
| #6666FF |
| #6666CC |
| #666699 |
| #666666 |
| #666633 |
| #666600 |
| #6633FF |
| #6633CC |
| #663399 |
| #663366 |
| #663333 |
| #663300 |
| #6600FF |
| #6600CC |
| #660099 |
| #660066 |
| #660033 |
| #660000 |
| R=33基準 |
|---|
| #33FFFF |
| #33FFCC |
| #33FF99 |
| #33FF66 |
| #33FF33 |
| #33FF00 |
| #33CCFF |
| #33CCCC |
| #33CC99 |
| #33CC66 |
| #33CC33 |
| #33CC00 |
| #3399FF |
| #3399CC |
| #339999 |
| #339966 |
| #339933 |
| #339900 |
| #3366FF |
| #3366CC |
| #336699 |
| #336666 |
| #336633 |
| #336600 |
| #3333FF |
| #3333CC |
| #333399 |
| #333366 |
| #333333 |
| #333300 |
| #3300FF |
| #3300CC |
| #330099 |
| #330066 |
| #330033 |
| #330000 |
| R=00基準 |
|---|
| #00FFFF |
| #00FFCC |
| #00FF99 |
| #00FF66 |
| #00FF33 |
| #00FF00 |
| #00CCFF |
| #00CCCC |
| #00CC99 |
| #00CC66 |
| #00CC33 |
| #00CC00 |
| #0099FF |
| #0099CC |
| #009999 |
| #009966 |
| #009933 |
| #009900 |
| #0066FF |
| #0066CC |
| #006699 |
| #006666 |
| #006633 |
| #006600 |
| #0033FF |
| #0033CC |
| #003399 |
| #003366 |
| #003333 |
| #003300 |
| #0000FF |
| #0000CC |
| #000099 |
| #000066 |
| #000033 |
| #000000 |