彩度

彩度 (Saturation) は、色の三属性 (色相・彩度・明度) の一つで、色の鮮やかさや純度を数値化したものである。彩度が最大の色は純色と呼ばれ、白や黒が混ざるほど彩度は低下する。彩度がゼロの状態は無彩色 (グレースケール) であり、色相の情報を持たない。日常的な例でいえば、真っ赤なトマトは彩度が高く、くすんだレンガ色は同じ赤系統でも彩度が低い。

• HSL/HSV モデルでの表現: HSL (Hue, Saturation, Lightness) や HSV (Hue, Saturation, Value) 色空間では、彩度は 0-100% のパーセンテージで表される。CSS の hsl(0, 100%, 50%) は純粋な赤、hsl(0, 30%, 50%) はくすんだ赤になる。直感的に色を指定できるため、デザインシステムのカラーパレット設計で重宝される
• 彩度と自然さの関係: 彩度を過度に上げると色が飽和して不自然な印象になり、肌色がオレンジ色に転んだり空が塗り絵のようになる。Lightroom の Vibrance (自然な彩度) は彩度の低い色を優先的に引き上げ、既に鮮やかな肌色やオレンジ系の飽和を防ぐインテリジェントな調整を行う
• 知覚的均一性の問題: RGB や HSL の彩度変更は知覚的に均一ではない。たとえば HSL で彩度を 50% から 70% に上げた場合、青系の色は大きく変化するが黄色系はほとんど変わらない。CIELAB の Chroma や OKLCH の C 成分は人間の知覚に基づいて設計されており、色相に依存しない均一な彩度調整が可能である

写真編集では彩度調整は色補正の基本操作であり、風景写真では彩度を +15 から +25 程度上げて鮮やかさを強調し、ポートレートでは控えめにして肌の自然さを保つのが定石である。Web 開発では CSS の filter: saturate(1.3) で画像の彩度を 30% 強調でき、ホバーエフェクトやダークモード対応に活用される。グレースケール変換は filter: saturate(0) で実現でき、追悼ページや無効状態の UI 表現に使われる。