RGBとは
R＝レッド（赤）G＝グリーン（緑）B＝ブルー（青）
RGBは光の三原色を利用した色の表現方法。主にPCのモニター、スマホの画面、テレビなどはRed、Green、Blueの三原色で色を再現していて、Webデザインをする際に使用するカラーモードはRGBになります。これらのデバイスでは、各ピクセルが赤、緑、青の小さな光を発し、それらを組み合わせることで様々な色を表現しています。
RGBの仕組み：加法混色
RGBは、赤（Red)、緑（Green)、青（Blue）の３つの光を組み合わせて色を作る。光を混ぜるほど明るくなって、最終的に白に近づくから「加法混色」と呼ばれています。
- R（赤）＋ G（緑）＋ B（青）＝ 白
- 光がない状態＝黒
各色は一般的に0～255の256の階段の数値で表されます。
- 例：赤から(255,0,0)、白なら(255,255,255)、黒なら（0,0,0）
なぜ「赤・緑・青」なのか？
これは人間に目の網膜にある、色を感じる細胞（錐体細胞）が、主にこの３つの波長に反応するようにできているため。人間に視覚システムに合わせた、非常に効率的な色の再現方法といえます。
CMYKとの違い
デザイン業務で最も注意すべきなのが、印刷用のカラーモードであるCMYKとの違いです。
| 特徴 | RGB | CMYK |
| 用途 | Webサイト、SNS、動画、アプリ | チラシ、名刺、ポスター、冊子 |
| 媒体 | モニター、ディスプレイ（発光体） | 紙、インク（反射光） |
| 色の範囲 | 表現できる色の幅（色域）が広い | RGBに比べると色域が狭い |
| 混色法 | 加法混色（混ぜると白くなる） | 減法混色（混ぜると黒くなる） |
実務でのポイント
①印刷時は交換が必要
RGBで作成したデータをそのまま印刷すると、インクで表現できない鮮やかな色がくすんでしまいます。ポスターや名刺などの印刷物を作る際、あらかじめ制作ソフト（lllustratorやPhotoshopなど）のドキュメント設定をCMYKモードにする必要があります。
②WebデザインやバナーはRGB
Webサイトの素材やSNS投稿用の画像、Figmaでのプロトタイプ作成などは、全てRGBモードで書き出します。
③カラーコード（16進数）
Webの世界では、RGBを16進数に変換した「カラーコード（#FFFFFFなど）」がよく使われます。
- #FF0000→赤
- #00FF00→緑
- #0000FF→青
代表的は「色空間（カラースペース）」
同じRGBでも、実は「どの範囲まで色を表現できるか」という規格（色空間）がいくつか存在します。
・sRGB
世界標準の規格。Windows環境や一般的なモニター、Webサイト、デジタルカメラの標準設定です。どこでも安定して見える分、表現できる色の範囲は少し狭めです。
・Adobe RGB
Adobe社が提唱した規格。sRGBよりも「青から緑」にかけての表現力が非常に高く、プロの印刷や写真、精細なグラフィックデザインで使われます。
デジタルデバイスの構造
モニターを拡大して見ると、実は小さな「赤・緑・青」の点が並んでいる。これを画素（ピクセル）と呼びます。
・サブピクセル
１つのピクセルはさらに３つのサブピクセル（R・G・B）に分かれています。
・色の混ざり
私たちの目は、この非常に小さな光の点を遠くから見ることで、脳内で色が混ざり合い、複雑なグラデーションとして認識しています。
豆知識「白」と「黒」の意外な正体
- 黒：色ではなく、「光が全く消えている状態」を指す。
- 白：全ての光が最強（100％）で重くなっている状態。
スマホのダークモードが電池持ちに良いとされるのは、黒い部分の光の（電力）をオフにできるからです。
