わかりやすく 16進数 カラーコード とは

0と1の4個を1文字に

前のレッスンで、何もかもが0と1で書かれていることを確かめました。
でも、0と1だけを長く並べると、人の目には長すぎてまぎらわしくなります。
そこで4個ずつまとめて、1文字に縮めることにしました。
4ビットで作れる組み合わせは、0から15までのちょうど16通りです。

4個のスイッチで、0から15までの16通りが1文字で表されます。

ただし、問題が一つあります。
10、11、12のように2けたになると、それが1文字なのか2文字なのか区別しにくくなります。
そこで、もう一つ工夫した約束が必要になりました。

9の次はA

私たちが使う数字は9までしかありません。
ところが16進数では1文字で15まで表さなければならないので、6文字足りません。
その分をアルファベットで埋めました。
9の次はA、その次はB、というようにFまで続きます。

数字10個にアルファベット6個を加えて、1文字で16通りを表します。

つまり、Aは10、Fは15という意味です。
怖い暗号ではなく、数字が足りなくて借りてきたアルファベットだったのです。

画面の色は3つの光を混ぜたもの

ここからは画面の色の話です。
画面のあらゆる色は、赤・緑・青の3つの光を混ぜて作られています。
それぞれの光をどれだけ強くつけるかで、色が決まります。
下の3本のスライダーを動かすと、すぐに色が変わります。

3つとも消すと黒、3つとも最大にすると白になります。

3つの光をそれぞれ0から255まで調整すると、1600万を超える色ができます。
ところで、色といっしょに表示されるコードに見覚えはありませんか。

#FAA832を3つに切る

カラーコードは、赤・緑・青の3つの値を16進数で書いて、横に並べただけのものです。
6文字を2文字ずつに切ると、3つのかたまりになります。
最初の2文字が赤、真ん中が緑、最後が青です。

2文字ずつ切って読みます。

Fは15、Aは10でした。
ですからFAは16×15+10で、250になります。
同じように読むと、#FAA832は赤250、緑168、青50という意味で、その結果がこの暖かい黄色です。

これでコードが読める

一度慣れてしまえば、コードを見ただけでおおよその色がわかります。
下の色がその例です。
赤の値が大きければ赤っぽく、3つとも大きければ明るくなります。
もう暗号ではありません。

3つの値がどれも大きいと明るく、1色だけ大きいとその色が濃く見えます。