【子ども向け】コンピュータと色の話。光の三原色(RGB)とカラーコードを分かりやすく解説

画用紙がようしに絵えの具ぐで絵えを描かくときは、色いろをなんとなく混まぜて作つくりますよね。

では、パソコンやタブレットの画面がめんはどのように色いろを決きめているのでしょうか。

コンピュータの中なかでは、色いろはきちんとしたルールで決きめられています。

では、そのルールってどんなものなのでしょう？

図ずを使つかいながらやさしく説明せつめいします。
いっしょに見みていきましょう。

絵の具の三原色（青・赤・黄）

まずは、学校がっこうでおなじみの絵えの具ぐ。

青あお・赤あか・黄きの3色しょくを混まぜると、さまざまな色いろが作つくれますね。

絵えの具ぐは混まぜるほど黒くろに近ちかづきます。

じつは2種類ある「色の作り方」

色いろの作つくり方かたには、大おおきく分わけて2つあります。

コンピュータやテレビは、「光ひかり」を重かさねて色いろを作つくっています。

光の三原色(RGB)

パソコンやタブレットの画面がめんを作つくっているのは、目めに見みえないほど小ちいさな「光ひかりのつぶ」です。

光ひかりのつぶをぐーんと拡大かくだいしてみると、赤あか・緑みどり・青あおの光ひかりがならんでいるのが見みえてきます。

この3色しょくを「光ひかりの三原色さんげんしょく」といいます。

頭文字かしらもじをとって「RGB（アールジービー）」」といいます。

この3つの光ひかりを強つよくしたり弱よわくしたりして、画面がめんはたくさんの色いろを生うみ出だしているのです。

• 赤あか・緑みどり・青あおを全部ぜんぶいちばん強つよくすると → 白しろ
• 全部ぜんぶ光ひからせないと → 黒くろ

光ひかりは混まぜれば混まぜるほど明あかるくなって、最後さいごは「まぶしい白しろ」になります。

絵えの具ぐと光ひかりでは、混まぜたときの結果けっかがちがうのがおもしろいですね！

コンピュータでは数字で色を決める

コンピュータでは、赤あか・緑みどり・青あおそれぞれの光ひかりの強つよさを 0～255の数字すうじで表あらわします。

たとえば、こんなふうに表あらわします。

赤あか・緑みどり・青あおそれぞれが256通とおりの強つよさを持もっていて、3つを組くみ合あわせるので、
256 × 256 × 256 ＝ 約やく1,670万まん色しょく も作つくることができます！

球体型ロボット(Sphero)のLEDの色をRGBで指定するプログラム

カラーコードってなに？

ウェブデザインなどでは、色いろを「#（ハッシュ）＋6ケタの記号きごう」で表あらわすことがあります。

これを「カラーコード」といいます。

カラーコードは「色いろの正確せいかくなレシピ」のようなもの。

「赤あか」と言いっても、人ひとによって明あかるい赤あかだったり暗くらい赤あかだったり、イメージする赤あかはバラバラですよね。

でも、数字すうじで指定していすれば、どのコンピュータでもほぼ同おなじ色いろを作つくれます。

たとえば、こんなふうに表あらわします。

これは、さっきのRGBの数字すうじ（0～255）を、ちがう書かき方かたになおしたものです。

RGBそれぞれの光ひかりの強つよさを、2ケタずつで表あらわしています。
そのときに使つかうのが、0～9とA～Fを使つかった特別とくべつな数字すうじ（16進数しんすう）です。

• 数字すうじで書かくと：rgb(255, 255, 0)（14文字もじ）
• カラーコードで書かくと：#FFFF00（7文字もじ）

赤あか・緑みどり・青あおの3つぶんあるので、2ケタ × 3色しょく ＝ 合計ごうけい6ケタになります。
10進数しんすうよりも 文字もじ数すうが少すくなくてすみますね。

グラフィックデザインツール(Canva)で素材の色を変える

【まめちしき】カラーコードに出てくる「A〜F」って何？

カラーコードをよく見みると、0～9の数字すうじのほかに A～F のアルファベット が出でてきます。

これは「16進数しんすう」という数かずの書かき方かたです。

ふつうの数字すうじ（10進数しんすう）は、9の次つぎは 10 になりますよね。

でも16進数しんすうでは、9の次つぎは A（＝10）、B（＝11）…と続つづき、F（＝15）の次つぎで 10 になります。

つまり、16になるとケタが上あがります。

16進数しんすうは、コンピュータの中なかでデータをあつかうときに便利べんりなので、よく使つかわれています。

まとめ

絵えの具ぐだと一発いっぱつ勝負しょうぶですが、パソコンやタブレットなら納得なっとくする色いろができるまで何度なんどでも試ためせるのがいいですね。

球体きゅうたい型がたロボット Sphero（スフィロ）は、RGBの値あたいを設定せっていしてLEDを好すきな色いろで光ひからせることができます。
実際じっさいにRGBを使つかうプログラムを体験たいけんできるので、興味きょうみがある人ひとは下したの記事きじもぜひ読よんでみてください！

【Sphero miniレビュー】プログラミング初心者から上級者まで楽しめる球体型ロボット

「Sphero mini」は、6,000円前後で手に入る初心者向けのプログラミングロボット。おうちでプログラミングを学ぶのにピッタリの玩具です。【リビングの魔王】ではSphero miniの特徴や使い方をレビューします。

living-maou.com