24ビットカラーの全体像：RGB・色深度・色空間・ガンマの違いとWeb・画像処理での実務適用
エバープレイ編集部はじめに — 24ビットカラーとは何か
24ビットカラーとは、1ピクセルを表現するのに24ビット（3バイト）を用いる色表現方式で、通常は赤（R）、緑（G）、青（B）の3つのチャンネルにそれぞれ8ビットずつ割り当てられます。各チャンネルは0〜255（256段階）の輝度を取り得るため、理論上は256 × 256 × 256 = 16,777,216色（約1677万色）を表現できます。このため「True Color（トゥルーカラー）」とも呼ばれ、一般的なディスプレイやウェブ画像の標準的な色深度として広く用いられてきました。
技術的な内訳
24ビットカラーの基本構成は以下の通りです。
- チャンネル：R（赤）、G（緑）、B（青）の3チャンネル
- 各チャンネルのビット数：8ビット（0〜255）
- 総色数：256^3 = 16,777,216色
- メモリ上の表現：一般的に1ピクセルあたり3バイト（packed RGB、順序はBGRやRGBなど実装依存）
例えばHTML/CSSでの16進表記 #RRGGBB はまさに24ビットカラーの表記形式で、#FF0000 が最大の赤、#00FF00 が最大の緑、#0000FF が最大の青を表します。
24ビットと32ビットの違い（アルファチャネル）
よく混同されるのが「32ビットカラー」です。32ビットカラーは24ビットのRGBに加えて8ビットのアルファ（透過）チャンネルを持つことが多く、ピクセルあたり4バイトになります。したがって、24ビットは色のみ（不透明）を表し、透明度を扱う場面では32ビット（8ビットアルファ）を用いるのが一般的です。
色空間（ガモット）とビット深度の違い
重要な点として「色深度（bit depth）」と「色空間（color gamut）」は別物です。24ビットは1チャネルあたりの分解能（階調数）を示しますが、どの色域にマッピングされるか（sRGB、Adobe RGB、DCI-P3、Rec.2020など）は別途規定されます。例えばsRGBの8ビット/チャンネル画像でも、広色域のディスプレイや異なる色管理が絡むと見え方が変わります。
ヒトの視覚と24ビットの十分性
人間の視覚は色を約数百万〜数千万段階で識別できると言われ、概ね24ビット（約1,677万色）は通常の写真表示やウェブ用途で十分とされます。しかし、特定条件（グラデーションが滑らかに表示される必要がある場合や、大判印刷、色補正作業）では8ビット/チャンネルでは階調の不足（バンディング）が問題になることがあります。そうした場合、10/12/16ビット/チャンネルといった高ビット深度が用いられます。
ガンマと非線形符号化の影響
実際の色表現では線形な輝度値ではなくガンマ補正（非線形変換）が行われることが多く、これにより8ビットでも視覚的に有用な階調配分が実現されます。sRGBなどの標準ではガンマカーブが定義されており、これにより暗部や明部の可視階調分布が調整されます。したがって「8ビット＝256階調」でも視覚的にはもっと多くの階調に見えるよう設計されています。
フォーマット別の扱い（Web、画像、動画）
- PNG：PNGはTruecolor（24ビット）またはRGBA（32ビット）をサポートし、内部的には8ビット/チャンネルが一般的。16ビット/チャンネルのPNGも存在する（PNG形式は16ビット/チャネルをサポート）。
- JPEG：JPEGは通常8ビット/チャンネルのY'CbCrでエンコードされ、見かけ上は24ビット相当のフルカラー表示となるが内部処理で色空間変換やサブサンプリング（4:2:0など）が行われることが多い。
- GIF：GIFはパレット方式で最大256色（8ビットパレット）まで。24ビットのフルレンジは表現できない。
- ビデオ：動画では色深度だけでなく色差サンプリング（4:4:4, 4:2:2, 4:2:0）やビット深度（8/10/12bit）が重要。多くの放送/配信は圧縮やサンプリングでデータ削減される。
バンディングとディザリング
8ビット/チャンネルでは滑らかなグラデーションでも階調不足によりバンド（階調段差）が見えることがあります。対策としてディザリング（ノイズを加えることで階調を擬似的に増やす）がよく使われます。ディザリングには空間的ディザ（ordered dither, error diffusion など）や時間的ディザ（動画でフレーム毎に微妙に変える）があります。
実装上のメモリとパフォーマンス
24ビットピクセルは3バイト/ピクセルなので、画像のメモリサイズは幅×高さ×3で概算できます。多くのグラフィックライブラリやGPU内部ではパフォーマンスやアラインメントの都合で24ビットより32ビット（4バイト）を用いることが多く、1行が4バイト境界に揃えられることがあります（ピッチ=stride）。
プロフェッショナルワークフローと高ビット深度
写真現像や色補正、CG合成などプロ用途では1チャンネルあたり10〜16ビットや浮動小数点（32-bit float）を使うことが多いです。これにより色補正の際の量子化ノイズや色切れを抑え、HDR処理や精密な合成が可能になります。完成物をインターネットや標準ディスプレイ向けに落とし込む際に24ビットに変換するワークフローが一般的です。
WebとCSSでの扱い
ウェブでは標準的に8ビット/チャンネル（24ビット表現）が利用されます。CSSのカラー指定（#RRGGBB, rgb(), rgba()）はこの範囲を基本とします。ただし、現代のブラウザ/ディスプレイは広色域や10ビット表示をサポートする場合があり、色管理（ICCプロファイル、カラーレンダリング）が重要になります。
まとめ — 使いどころと限界
24ビットカラーは汎用性が高く、ウェブや一般写真、アプリケーション表示において「十分な色数」を提供します。一方で、色域の広さ（ガモット）やプロ向けの色補正、HDR表現、非常に滑らかなグラデーションを要求される場面ではビット深度の不足やアルファの不在が問題となるため、10/12/16ビットやRGBA（32ビット）、あるいは浮動小数点表現が使われます。ディザリングや色管理を適切に行うことで24ビットでも良好な結果は得られますが、要件に応じて色深度と色空間を選択することが重要です。
参考文献
- Color depth — Wikipedia
- True color — Wikipedia
- PNG (Portable Network Graphics) Specification — W3C
- CSS color — MDN Web Docs (日本語)
- sRGB — Wikipedia
- JPEG — Wikipedia
- International Color Consortium (ICC) — 色管理のリソース
投稿者プロフィール
