Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

HLS色空間(エイチエルエス)とは | 意味や読み方など丁寧でわかりやすい用語解説

HLS色空間(エイチエルエス)の意味や読み方など、初心者にもわかりやすいように丁寧に解説しています。

作成日: 更新日:

読み方

日本語表記

エイチエルエス (エイチエルエス)

英語表記

HLS color space (エイチエルエスイー カラー スペース)

用語解説

HLS色空間は、コンピュータグラフィックスや画像処理の分野で利用される色表現方法の一つである。HLSとは、Hue(色相)、Lightness(輝度)、Saturation(彩度)という3つの要素の頭文字を取ったものである。これは、人間が色を認識する際の感覚的な要素、すなわち「どんな色か」「明るいか暗いか」「鮮やかか地味か」という三つの軸で色を定義するモデルである。コンピュータのディスプレイなどで標準的に用いられるRGB色空間が、赤・緑・青の光の三原色を混ぜ合わせて色を表現する物理的なモデルであるのに対し、HLSはより人間の知覚に近い直感的な色空間として設計されている。この特性により、デザイナーやクリエイターが特定の色を調整したり、アプリケーションのユーザーが直感的に色を選択したりする場面で非常に有用となる。

次に、HLSを構成する各要素について詳細に解説する。まずHue(色相)は、色の種類そのものを表す。例えば、赤、黄、緑、青といった、私たちが日常的に使う色の名前がこれに該当する。HLS色空間では、色相を0度から360度までの角度で表現する。これは色を円環状に配置した色相環(カラーホイール)をイメージすると理解しやすい。一般的に、0度が赤、60度が黄、120度が緑、180度がシアン、240度が青、300度がマゼンタに割り当てられ、360度で再び赤に戻る。このように角度で色を指定するため、連続的な色の変化を滑らかに表現することが可能である。

二つ目の要素はLightness(輝度)であり、色の明るさの度合いを示す。この値は通常、0から1までの小数、または0%から100%のパーセンテージで表現される。Lの値が0の場合、色相や彩度の値に関わらず色は完全な黒となる。逆に、Lの値が1(100%)の場合は、同様に他の値とは無関係に完全な白となる。そして、Lの値が0.5(50%)のときに、その色相において最も純粋で鮮やかな色、いわゆる純色が現れる。この中間点が最も彩度が高くなるという特性は、HLS色空間を理解する上で重要なポイントである。

三つ目の要素はSaturation(彩度)で、色の鮮やかさ、つまり色の純度を表す。輝度と同様に、0から1または0%から100%で表現される。Sの値が1(100%)のとき、色は最も鮮やかになる。値が0に近づくにつれて、色は鮮やかさを失い、くすんだ色、すなわち灰色に近づいていく。Sの値が0になると、色は完全に彩度を失い、白、黒、またはその中間の灰色といった無彩色になる。ただし、前述の通り、輝度Lが0(黒)または1(白)である場合、彩度Sの値が何であれ結果は無彩色となる。これは、真っ暗な状態や光が最大限に当たった状態では、色の鮮やかさが知覚できなくなるという現実の現象をモデル化したものと解釈できる。

これらの3つの要素から構成されるHLS色空間は、幾何学的にはダブルコーン(双円錐)モデルとして表現される。このモデルでは、円錐を二つ、底面で貼り合わせたような形状をしている。中心を貫く垂直な軸が輝度(L)を表し、一番下が黒(L=0)、一番上が白(L=1)に対応する。中心軸からの水平距離が彩度(S)を表し、軸上が無彩色(S=0)、外周に向かうほど彩度が高くなる。そして、中心軸を周る角度が色相(H)を表す。このモデルにより、全ての色が3次元空間内の一点としてマッピングされる。

HLS色空間の最大の利点は、その直感的な操作性にある。例えば、ある特定の色を「もう少し明るくしたい」と考えた場合、RGBモデルでは赤・緑・青の3つの値をどのように変更すれば良いか直感的に判断するのは難しい。しかし、HLSモデルであれば、L(輝度)の値を少し上げるだけで目的を達成できる。「もう少し鮮やかにしたい」のであればS(彩度)の値を上げ、「少し色味を変えたい」のであればH(色相)の値を変更すればよい。このため、グラフィックデザインソフトウェアのカラーピッカーや、写真の色調補正機能などで広く採用されている。システム開発の文脈では、ユーザーインターフェース(UI)の色設計において、基本となるテーマカラーの色相(H)を固定したまま、輝度(L)や彩度(S)をプログラムで動的に変更することで、統一感を保ちつつ色のバリエーションを容易に生成することができる。また、画像処理において特定の色の物体を検出する際にも、RGB値の範囲指定よりも、色相(H)の範囲を指定する方が、照明の変化などの影響を受けにくく、より安定した抽出が可能になる場合がある。もちろん、コンピュータが最終的に画面に表示する際にはRGB値が必要となるため、HLSとRGBの間の相互変換を行う計算式が存在し、多くのプログラミング言語やライブラリにその機能が組み込まれている。システムエンジニアは、色の表現方法には複数の種類があり、それぞれに適した用途があることを理解し、目的に応じて最適な色空間を選択・利用することが求められる。

関連コンテンツ

HLS色空間(エイチエルエス)とは | 意味や読み方など丁寧でわかりやすい用語解説 | いっしー@Webエンジニア