【色の3属性】「HSV(HSB)」とは
皆さんは、「色の3属性」をご存知ですか?
以前こちらの記事でご紹介した「RGB」「CMYK」と合わせて覚えておくととても役立つ知識なので、今回は色の3属性「HSV(HSB)」についてご紹介します。
色の3属性とは
すべての色は3つの属性によって表現されます。
色の三属性は「色相」「明度」「彩度」です。
色相:色み
明度:色の明るさ
彩度:色の鮮やかさ
これら3つの属性を組み合わせることで、あらゆる色を作ることができます。
Hue/Saturation/Valueの頭文字をとってHSVカラーモデル(またはHue/Saturation/BrightnessでHSBカラーモデル)と呼ばれます。
色相
色相とは赤、青、緑、…といった色みを指します。
一般的に「色」というと、色相のことを指している場合が多いです。
トーンを合わせて配色をしたい時は、明度と彩度を変えずに色相のみ変えると、トーンが同じ違う色みの色を作ることができます。
明度
明度は色の明るさを表す属性です。
明度が高くなれば白に近づき、明度が低くなれば黒に近づきます。
明度差がないデザインは視認性が低下するので、注意してください。
無彩色
無彩色とは三属性の『色相』と『彩度』が無く、明度のみで表すモノクロカラーになります。明度が低ければ黒になり、明度が高くなるほど白に近づきます。
彩度
彩度は色の鮮やかさを表す属性です。
彩度が高くなるほど鮮やかな色になり、低くなると色みがなくなりくすんだ色になっていきます。
彩度は「色みの量」を決定する要素で、彩度を上げれば鮮やかに、下げれば無彩色に変化していきます。
まとめ
今回は、簡単に色の3属性についてご紹介しました。
IllustratorなどデザインツールにはHSV(HSB)を編集する機能が付いているものが多いと思うので、実際に数値を変えて、色々な色を作ってみてください。
この値を上げるとどうなるのかなどが分かってこれば、欲しい色を簡単に作ることができるようになってきます。ぜひ、色々試しながらスキルを身につけていってください!
「東三河・西三河で働く!」高時給な派遣求人が満載!
-
前の記事
【Javascript】Choices.jsのひらがな・カタカタ・漢字でのフィルタリング機能をカスタマイズしてみた 2024.09.30
-
次の記事
【jQuery】Formを使用時のデータ送信はserialize()関数とserializeArray()関数がおススメ!! 2024.11.06