前回のおさらい。
すべての色は赤・緑・青の組み合わせで表現できる
『光の三原則』という言葉があるように、パソコンの画面上のすべての色は赤・緑・青の3色の組み合わせで表現します。
『ブルー』といっても薄い青から濃い青、緑がかった青や黒っぽい青などいろいろありますが『赤：78 緑：103 青：200のブルー』と指定すれば色を特定することができます。
実際には『RGB(78,103,200)』と表現します。
- R → Red → 赤が78
- G → Green → 緑が103
- B → Blue → 青が200
ちなみにRGB(78,103,200)は↓の色。
色味のない色、つまり黒と白も赤・緑・青の組み合わせで表現します。
- 黒は赤・緑・青がすべて0 → RGB(0,0,0)
- 白は赤・緑・青がすべて255 → RGB(255,255,255)
具体的に色の名前を見てみよう
色相環の一部
モノクロの場合
色名を表現するときは［10進値］と［16進値］の二通りの表記法があります。どちらの値で色を指定するかは使うソフトウエアや状況によって決まります。
10進値
色名を［10進数］で表したものです。［10進数］とは0から9まで数えたら桁がひとつ上がるという、日常生活で使っている数の数え方です。これまでの色の話は10進値で色の名前を表現していました。
10進値の特徴
- R、G、Bの値を0から255までの範囲で指定する
- 全てが0のとき → RGB(0,0,0) → 黒
- 全てが255のとき → RGB(255,255,255) → 白
ソフトの一例
- Microsoft Office
- Windowsのペイント
- JTrim
- GIMP ← GIMPは10進値・16進値両方使える
16進値
色の名前の先頭に『#』がついていれば［16進値］で表現した色名です。
『#』のあとの数字を2桁ずつに区切って考えます。左からR、G、Bの色を表します。
「『FF』が数字？」と思うかもしれませんね。これは［16進数］と呼ぶ数値の表記方法です。［16進数］はコンピュータの世界で使われる数の数え方で、あまりなじみがないかもしれません。
1の位の値は0～9とA～Fを使います。Fは10進数の16に相当します。
0、1、2、3、4、5、6、7、8、9、A、B、C、D、E、F
Fまで数えたら桁が上がります。
10、11、12、13、14、15、16、17、18、19、1A、1B、1C、1D、1E、1F
「10」は「じゅう」でなく「いちぜろ」と読みます。
16進値の特徴
- 10進数の「0」は16進数でも「0」
- 10進数の「255」は16進数では「FF」
- R、G、Bの値を0からFFまでの範囲で指定する
- 全てが0のとき → #000000 → 黒
- 全てがFFのとき → #FFFFFF → 白
- 2桁の数字が同じときは略して書くことがある → #FFFは#FFFFFFと同じ意味
ソフトの一例
- Photoshop
- Web系ファイル（htmlやcss）の記述
- GIMP ← GIMPは10進値・16進値両方使える
色を指定しよう
自分が使うソフトが10進値・16進値のどちらで色を指定するのかを確認し、それに合わせて数値を入力します。
赤だったら
255,0,0 または #FF0000
を入力すればOKですね。
さてここで問題が
↑の表のように色に対応する値が両方が書かれていれば値をそのまま入力すればいいのですが、10進値または16進値どちらか一方の値しかわからないことも多いです。
そんなときは値を変換します。いちいち計算するのは面倒なので変換ツールを使うわけですが、Windowsに入っている電卓を使うと簡単に変換ができます。別記事に使い方を書きました。
関数電卓を持っていれば関数電卓を使ってください。
スマートフォンのアプリがよければ「10進 16進 変換」で検索するといろいろ出てきます。