Go to information
Webセーフカラー
Webセーフカラー（Web safe colors）とは、Internet Explorer や Netscape といったブラウザ、または Windows や Macintosh といったプラットフォーム（OS）など環境の違いに左右されない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（ビデオメモリ）の容量に左右されます。現在では、コンピュータの機能も大きく向上し、65,536色（16ビット）あるいは16,777,216万色（24ビットまたは32ビット）の表現が可能な環境をもったユーザーが標準的になりました。しかし、全てのユーザー（閲覧者）が最新の環境（コンピュータ）でウェブページを閲覧しているわけではありません。ユーザーが利用している環境（コンピュータ）によっては、VRAM の容量が少なくて同時発色数に制限があるなど、ウェブページ側で指定した色の全てを表現できないこともあるので注意が必要です。こういった理由から環境の違いに左右されない216色の Webセーフカラーを使えば良いのですが、必ずしも Webセーフカラーの216色以外を使ってはいけないというわけではありません。
サイト全体のデザインすべてを Webセーフカラーの216色だけに限って制作するというのはとても難しいことです。ですので、現在のユーザーの閲覧環境の向上を考慮すればサイト内全体に共通するデザインなど再現できないと困る重要な部分においては、できる限り 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 |
|
- 現在位置
- W3G
- Others
- 色
- Webセーフカラー
- ナビゲーション
- World Wide Web Guide
- ステータス情報
- 作者
- 上田 遼
- 公開
- 2005-09-23T14:59:32+09:00
- 更新
- 2008-12-29T04:19:16+09:00
- URI
http://w3g.jp/others/color/websafecolors
- 検索
-
直近の制作実績等：大阪人間科学大学 New! / 大阪薫英女子短期大学 New! / セキスイハイム みんなのお国じまん New!
