webセーフカラー全216色チャート【html色一覧】

webセーフカラー一覧

webセーフカラーの一覧です。

webセーフカラーの16進数コードとRBAa値を全216色掲載してます。

※rgba値の使い方は「【css】背景(backgroundプロパティ)の使い方まとめ」で紹介していますので、ご参考までに

webカラーコード一覧
webカラーコード一覧(ネームで指定できる色140色)
webセーフカラー216色
パステルカラー300色
モノトーンカラー256色
ビビッドカラー300色
webサイトのリンクで使われている色
日本の伝統色760色
中国の伝統色245色
フランスの伝統色330色
世界の洋色の名前413色(カラーコード付き)

webセーフカラー一覧(全216色)

#FFFFFF
rgba(255,255,255,1)
#FFFFCC
rgba(255,255,204,1)
#FFFF99
rgba(255,255,153,1)
#FFFF66
rgba(255,255,102,1)
#FFFF33
rgba(255,255,51,1)
#FFFF00
rgba(255,255,00,1)
#FFCCFF
rgba(255,204,255,1)
#FFCCCC
rgba(255,204,204,1)
#FFCC99
rgba(255,204,153,1)
#FFCC66
rgba(255,204,102,1)
#FFCC33
rgba(255,204,51,1)
#FFCC00
rgba(255,204,00,1)
#FF99FF
rgba(255,153,255,1)
#FF99CC
rgba(255,153,204,1)
#FF9999
rgba(255,153,153,1)
#FF9966
rgba(255,153,102,1)
#FF9933
rgba(255,153,51,1)
#FF9900
rgba(255,153,00,1)
#FF66FF
rgba(255,102,255,1)
#FF66CC
rgba(255,102,204,1)
#FF6699
rgba(255,102,153,1)
#FF6666
rgba(255,102,102,1)
#FF6633
rgba(255,102,51,1)
#FF6600
rgba(255,102,00,1)
#FF33FF
rgba(255,51,255,1)
#FF33CC
rgba(255,51,204,1)
#FF3399
rgba(255,51,153,1)
#FF3366
rgba(255,51,102,1)
#FF3333
rgba(255,51,51,1)
#FF3300
rgba(255,51,00,1)
#FF00FF
rgba(255,00,255,1)
#FF00CC
rgba(255,00,204,1)
#FF0099
rgba(255,00,153,1)
#FF0066
rgba(255,00,102,1)
#FF0033
rgba(255,00,51,1)
#FF0000
rgba(255,00,00,1)
#CCFFFF
rgba(204,255,255,1)
#CCFFCC
rgba(204,255,204,1)
#CCFF99
rgba(204,255,153,1)
#CCFF66
rgba(204,255,102,1)
#CCFF33
rgba(204,255,51,1)
#CCFF00
rgba(204,255,00,1)
#CCCCFF
rgba(204,204,255,1)
#CCCCCC
rgba(204,204,204,1)
#CCCC99
rgba(204,204,153,1)
#CCCC66
rgba(204,204,102,1)
#CCCC33
rgba(204,204,51,1)
#CCCC00
rgba(204,204,00,1)
#CC99FF
rgba(204,153,255,1)
#CC99CC
rgba(204,153,204,1)
#CC9999
rgba(204,153,153,1)
#CC9966
rgba(204,153,102,1)
#CC9933
rgba(204,153,51,1)
#CC9900
rgba(204,153,00,1)
#CC66FF
rgba(204,102,255,1)
#CC66CC
rgba(204,102,204,1)
#CC6699
rgba(204,102,153,1)
#CC6666
rgba(204,102,102,1)
#CC6633
rgba(204,102,51,1)
#CC6600
rgba(204,102,00,1)
#CC33FF
rgba(204,51,255,1)
#CC33CC
rgba(204,51,204,1)
#CC3399
rgba(204,51,153,1)
#CC3366
rgba(204,51,102,1)
#CC3333
rgba(204,51,51,1)
#CC3300
rgba(204,51,00,1)
#CC00FF
rgba(204,00,255,1)
#CC00CC
rgba(204,00,204,1)
#CC0099
rgba(204,00,153,1)
#CC0066
rgba(204,00,102,1)
#CC0033
rgba(204,00,51,1)
#CC0000
rgba(204,00,00,1)
#99FFFF
rgba(153,255,255,1)
#99FFCC
rgba(153,255,204,1)
#99FF99
rgba(153,255,153,1)
#99FF66
rgba(153,255,102,1)
#99FF33
rgba(153,255,51,1)
#99FF00
rgba(153,255,00,1)
#99CCFF
rgba(153,204,255,1)
#99CCCC
rgba(153,204,204,1)
#99CC99
rgba(153,204,153,1)
#99CC66
rgba(153,204,102,1)
#99CC33
rgba(153,204,51,1)
#99CC00
rgba(153,204,00,1)
#9999FF
rgba(153,153,255,1)
#9999CC
rgba(153,153,204,1)
#999999
rgba(153,153,153,1)
#999966
rgba(153,153,102,1)
#999933
rgba(153,153,51,1)
#999900
rgba(153,153,00,1)
#9966FF
rgba(153,102,255,1)
#9966CC
rgba(153,102,204,1)
#996699
rgba(153,102,153,1)
#996666
rgba(153,102,102,1)
#996633
rgba(153,102,51,1)
#996600
rgba(153,102,00,1)
#9933FF
rgba(153,51,255,1)
#9933CC
rgba(153,51,204,1)
#993399
rgba(153,51,153,1)
#993366
rgba(153,51,102,1)
#993333
rgba(153,51,51,1)
#993300
rgba(153,51,00,1)
#9900FF
rgba(153,00,255,1)
#9900CC
rgba(153,00,204,1)
#990099
rgba(153,00,153,1)
#990066
rgba(153,00,102,1)
#990033
rgba(153,00,51,1)
#990000
rgba(153,00,00,1)
#66FFFF
rgba(102,255,255,1)
#66FFCC
rgba(102,255,204,1)
#66FF99
rgba(102,255,153,1)
#66FF66
rgba(102,255,102,1)
#66FF33
rgba(102,255,51,1)
#66FF00
rgba(102,255,00,1)
#66CCFF
rgba(102,204 255,1)
#66CCCC
rgba(102,204 204,1)
#66CC99
rgba(102,204 153,1)
#66CC66
rgba(102,204 102,1)
#66CC33
rgba(102,204 51,1)
#66CC00
rgba(102,204 00,1)
#6699FF
rgba(102,153,255,1)
#6699CC
rgba(102,153,204,1)
#669999
rgba(102,153,153,1)
#669966
rgba(102,153,102,1)
#669933
rgba(102,153,51,1)
#669900
rgba(102,153,00,1)
#6666FF
rgba(102,102,255,1)
#6666CC
rgba(102,102,204,1)
#666699
rgba(102,102,153,1)
#666666
rgba(102,102,102,1)
#666633
rgba(102,102,51,1)
#666600
rgba(102,102,00,1)
#6633FF
rgba(102,51,255,1)
#6633CC
rgba(102,51,204,1)
#663399
rgba(102,51,153,1)
#663366
rgba(102,51,102,1)
#663333
rgba(102,51,51,1)
#663300
rgba(102,51,00,1)
#6600FF
rgba(102,00,255,1)
#6600CC
rgba(102,00,204,1)
#660099
rgba(102,00,153,1)
#660066
rgba(102,00,102,1)
#660033
rgba(102,00,51,1)
#660000
rgba(102,00,00,1)
#33FFFF
rgba(51,255,255,1)
#33FFCC
rgba(51,255,204,1)
#33FF99
rgba(51,255,153,1)
#33FF66
rgba(51,255,102,1)
#33FF33
rgba(51,255,51,1)
#33FF00
rgba(51,255,00,1)
#33CCFF
rgba(51,204,255,1)
#33CCCC
rgba(51,204,204,1)
#33CC99
rgba(51,204,153,1)
#33CC66
rgba(51,204,102,1)
#33CC33
rgba(51,204,51,1)
#33CC00
rgba(51,204,00,1)
#3399FF
rgba(51,153,255,1)
#3399CC
rgba(51,153,204,1)
#339999
rgba(51,153,153,1)
#339966
rgba(51,153,102,1)
#339933
rgba(51,153,51,1)
#339900
rgba(51,153,00,1)
#3366FF
rgba(51,102,255,1)
#3366CC
rgba(51,102,204,1)
#336699
rgba(51,102,153,1)
#336666
rgba(51,102,102,1)
#336633
rgba(51,102,51,1)
#336600
rgba(51,102,00,1)
#3333FF
rgba(51,51,255,1)
#3333CC
rgba(51,51,204,1)
#333399
rgba(51,51,153,1)
#333366
rgba(51,51,102,1)
#333333
rgba(51,51,51,1)
#333300
rgba(51,51,00,1)
#3300FF
rgba(51,00,255,1)
#3300CC
rgba(51,00,204,1)
#330099
rgba(51,00,153,1)
#330066
rgba(51,00,102,1)
#330033
rgba(51,00,51,1)
#330000
rgba(51,00,00,1)
#00FFFF
rgba(00,255,255,1)
#00FFCC
rgba(00,255,204,1)
#00FF99
rgba(00,255,153,1)
#00FF66
rgba(00,255,102,1)
#00FF33
rgba(00,255,51,1)
#00FF00
rgba(00,255,00,1)
#00CCFF
rgba(00,204,255,1)
#00CCCC
rgba(00,204,204,1)
#00CC99
rgba(00,204,153,1)
#00CC66
rgba(00,204,102,1)
#00CC33
rgba(00,204,51,1)
#00CC00
rgba(00,204,00,1)
#0099FF
rgba(00,153,255,1)
#0099CC
rgba(00,153,204,1)
#009999
rgba(00,153,153,1)
#009966
rgba(00,153,102,1)
#009933
rgba(00,153,51,1)
#009900
rgba(00,153,00,1)
#0066FF
rgba(00,102,255,1)
#0066CC
rgba(00,102,204,1)
#006699
rgba(00,102,153,1)
#006666
rgba(00,102,102,1)
#006633
rgba(00,102,51,1)
#006600
rgba(00,102,00,1)
#0033FF
rgba(00,51,255,1)
#0033CC
rgba(00,51,204,1)
#003399
rgba(00,51,153,1)
#003366
rgba(00,51,102,1)
#003333
rgba(00,51,51,1)
#003300
rgba(00,51,00,1)
#0000FF
rgba(00,00,255,1)
#0000CC
rgba(00,00,204,1)
#000099
rgba(00,00,153,1)
#000066
rgba(00,00,102,1)
#000033
rgba(00,00,51,1)
#000000
rgba(00,00,00,1)

他のwebカラーは下の一覧からご覧になれます。

webカラーコード一覧
webカラーコード一覧(ネームで指定できる色140色)
webセーフカラー216色
パステルカラー300色
モノトーンカラー256色
ビビッドカラー300色
webサイトのリンクで使われている色
日本の伝統色760色
中国の伝統色245色
フランスの伝統色330色
世界の洋色の名前413色(カラーコード付き)

webセーフカラーとはNetscape社が発案した、8ビットカラー全256色のうち 40色を除いた216色のことです。

なぜwebセーフカラーがあるかというと、サイト制作者と訪問者とでは、環境によって色の見え方が変わることがあります。 というより、サイトを見る人のパソコンやosの違いによって指定した色が正しく表示されない場合があります。 そこでNetscape社は、Netscape Navigator(Netscapeのブラウザ)を使えば、どんな環境でも同じ色が表示できる216色(webセーフカラー)を発案しました。 つまりwebセーフカラーを使えば、どんな環境でも同じ色が表示できるよってことです。

ここからは豆知識なんですけどw webセーフカラーはRGBの三原色を6段階で分けた組み合わせの色です。

16進数で「00、33、66、99、cc、ff」10進数で「0、51、102、153、204、255」パーセンテージで「0%、20%、40%、60%、80%、100%」 というような6段階となってます。 これを6×6×6で216色となるわけです。 表を見ると横6縦6が6ブロック分あるのでわかりやすいと思います。 といってもどうでもいい知識ですねw

それと環境によって色が変わるなら、webセーフカラー以外は使わない方がよくね?って思うかもしれません。 ですが、今の時代のモニターは16ビットから32ビットなわけです。 しかも画像(jpeg)などはwebセーフカラー以上の色を余裕で使ってますので、特に気にしない方が良いです。

色の違いを気にするなら、まずはモニターを買い替えた方が無難です。 モニターが古くなると青色が強くなってきますし、全然色の見え方が違います。 なのでwebセーフカラーにこだわりすぎなくても大丈夫ですよ(^^(^^♪

以上「webセーフカラーチャートと豆知識」でしたー(^^)/

ブログランキング・にほんブログ村へ ブログランキング

頂いたコメント

  1. ゆり より:

    こんにちは、なるほど、そういう意味なんですね。
    色のコードもいろいろあって難しいのですがわかりやすく
    書いてくださるので助かります!

    • ゆう。 より:

      ゆりさん、こんにちわ(^^♪

      セーフカラーは名前の通りの意味ですよねw
      わかりやすいといって貰えるとうれしいです(#^^#)

      とりあえずコピペしやすくて、サンプルカラーが見やすいように作って見ましたw