FujiPro「ウェブマスター」

FujiMan Production - ウェブマスター -

ホームページ制作講座 for Windows【用語解説】
カラーコード

別ウィンドウで開いています。戻るときはこのウィンドウを閉じて下さい。

三原色

　カラーコードを説明する前に、「三原色」についてまず復習しましょう。

　三原色というのは、「すべての色は３つの原色から作ることができる」というものです。

　三原色には２種類あります。白いキャンパスに絵の具などの塗料を使って表現するときの「色の三原色」と、部屋を暗くして白いスクリーンに光を使って表現するときの「光の三原色」です。

　色の三原色は「赤色(Red)」「黄色(Yellow)」「青色(Blue)」の３色で、すべてを混ぜ合わせると「黒色(Black)」になります。
　光の三原色は「赤色(Red)」「緑色(Green)」「青色(Blue)」の３色で、すべてを混ぜ合わせると「白色(White)になります。

ＲＧＢカラー・コード

　パソコンでカラーを表現するときは、ブラウン管(CRT)にせよ、液晶にせよ、光の三原色を使っています。その３つの色の頭文字、Ｒed(赤)、Ｇreen(緑)、Ｂlue(青)をとって、「ＲＧＢカラー」といいます。

　このＲ、Ｇ、Ｂ、３つの色をそれぞれどれくらい混ぜ合わせて色を作るかをその順番で記号に表したものを「カラーコード」といいます。単なる文字列を区別するために、記号の先頭に「#(シャープ)」を付けて表します。

　たとえば、赤色は#FF0000になります。緑色は#00FF00、青色は#0000FFになります。

　これを見ると、左端の２文字が赤(R)、真ん中の２文字が緑(G)、右の２文字が青(B)を表していることが分かりますね。

　赤(R)と緑(G)を足すと#FFFF00となり、色は黄色になります。緑(G)と青(B)を足すと#00FFFFとなり、色は水色になります。同様に赤(R)と青(B)では桃色(#FF00FF)、すべてを足すと白色(#FFFFFF)、すべて使わないと黒色(#000000)になります。

　混ぜ合わせる色を加減することで、いろいろな色を作ることができるわけです。たとえば、#FF3366は「■こんな色■」になります。このそれぞれの記号を「00」～「FF」に変えることで、それぞれの色の加減をするわけです。

記号は16進数

　さて、カラーコードの「00」は「ゼロ」という意味らしいことは分かりますが、「FF」とは何を表しているんでしょうか。実はこれは立派な数字でして、パソコンの世界ではよく使われる16進数の数字です。

　「進数」というのは、「2進数」とか「10進数」「12進数」とかという「進数」です。この概念について、よく分かっていらっしゃる方にはよく分かるのですが、「苦手・・」という方には、なかなか理解させるのが難しい部分でもあります。

　あ、別に「苦手・・」という方をバカにしているわけじゃありません。なぜなら、私たちはあまりにも10進数に慣らされてしまっているからです。

　それはちょうどこういうことに似ています。私たちは中学から高校、ひとによっては大学を卒業するまで英語を学習してきましたけれど、急に英語を使ってと言われても、すぐに使えないのと同じです。使い慣れていないから、分からないように感じるだけなんです。

　16進数を使った数字の使い方は、このように考えてください。

　一番小さい数字は、「0」です。これはいいですか？
　次は「1」です。その次は「2」です。そうやって「9」まできました。その次は「10」ではありません。「9」の次は「A」になります。16進数ではそうなるんです。そう覚えておきましょう。
　え、そんな覚え方でいいのか？って。それでいいんです。要は使い方ですから・・・。(^^;
　それで「A」の次は「B」です。その次は「C」です。あと順に「D」「E」「F」となります。
　そして「F」の次に「10」となります。

　「10」の次はどうでしょうか。「11」となります。その次は「12」。その次は「13」。「14」「15」「16」「17」「18」「19」ときたら「1A」です。あとは「1B」「1C」「1D」「1E」「1F」と「F」まできたら「20」となります。

　この続きはどうでしょうか。「21」「22」「23」「24」「25」「26」「27」「28」「29」「2A」「2B」「2C」「2D」「2E」「2F」「30」です。分かりますか？

　そうやって、「40」「50」「60」「70」「80」「90」・・・「9F」ときたら、次は「A0」になります。

　「A0」・・・「AF」ときたら「B0」です。以後「C0」「D0」「E0」「F0」ときて、一番大きいのが「FF」となります。（やっと「FF」が出てきました。^^）
　勘のいい方は、「FF」の次が「100」になるとお気付きでしょうか。

　要は、「00」から「FF」まで、ちょうど右図のようなカウンターを回しているようなイメージで使って頂ければ、 16進数の理屈は分からなくても、カラーコードは使えるようになります。

　いいのかな、こんな説明で・・・(^^ゞ

別ウィンドウで開いています。
戻るときはこのウィンドウを閉じて下さい。