【UXデザイン第5段階: 表層】「明度」について

前回までに色の構成要素「色相(Hue)」「彩度(Saturation)」をご紹介してきました。今回のブログはは3つめの「明度(Brightness)」について見ていきましょう。

「明度」は色の明るさのちがいです。明度が高いほど白色に近い明るい色になっていき、低いと黒色に近い暗い色になっていきます。

たとえば上図のように青色の明度を上げると「水色」に近い色に、下げると「紺色」に近い色になっていきます。

また、明度は色相によっても変わります。

たとえば、ツール上で同じ明度の数値を指定したとしても、黄色と青色では明るさが異なります。黄色は各色相のなかでも明るい色、青は各色相のなかでも暗い色です。文字や絵を描く際に、白紙に黄色よりも、白紙に青色のほうが見やすいと感じるのは明度が異なるためです。明度が高い白色と、明度が高い黄色では、明度の差（コントラスト）が少なすぎるために見づらくなってしまうのです。

明度の値はAdobe製品等のツール上では帯状に配置されるのが一般的です。値は色相（0°-360°）のときとは異なり、0-100のパーセントで表示されます。

今回は色の基本的な考え方のひとつ「明度」についてご紹介しました。

---

皆さまからのリクエストも募集しています。 Webサイトの構築に関わるこんな情報が知りたい！などご希望がありましたら、是非こちらからリクエストをお願いします！