12色相だとちょっとものたりない気がしたので24色相の色相断面図を作成。彩度、明度による断面図も作ってみた。
色には「色の三属性」とよばれる3つの属性(色相、彩度、明度)があって、要素が3つあるので2次元でいっぺんには表示できない。そこで各属性ごとに他の2つの属性の表を表示してみたのがこれらの断面図。3つの断面図にはそれぞれ適正があって(おそらく)、目的の色の属性のうち色相(赤とか青とか)、彩度(色の鮮やかさ)、明度(白っぽいとか黒っぽいとか)のどれかがわかっている場合には使い分けると便利そう。
色相、彩度、明度はそれぞれ24、16、17段階に設定。これらの数字を選んだわけは、色相は基本の3原色(赤、緑、青)だと3色相、これらの中間色も加えて6色相、…とあと2回繰り返して24色相。
彩度は、16段階にすることによって16進表記にしたときにきれいな数字が少し多くでてくるような気がする(CCや99など。気のせいかも)。HTMLで色を指定するときは16進表記なので。
明度は、色相の基本となる色(24色)の上下に8段階ずつで計17段階。8は2の3乗なので2進数や16進数と相性がよいし。
ソース。いずれもJavaScriptが実行されます。
コンピュータで色を指定するときはRGB(赤、緑、青)の値で指定することも多いけど、このR、G、Bの順番は光のスペクトルの順番と同じなんだねぇ。
彩度断面図なんかを眺めてると色や光の性質があらわれているようで興味深いなぁ。同じ彩度でも青なんかの色は他の色よりも暗めだとか。「色光の三原色」であるレッド、グリーン、ブルーは少し暗めで、「色料の三原色」であるシアン、マゼンタ、イエローは明るめなのがわかる。これはそれぞれの混色の性質(加法混色と加法減色)と関係がありそうだなぁ。
12色相ではものたりなかったので24色相にしたのだけど、彩度断面図などで色相を並べてみるとまだ隣との色の差が結構ある気がする。とくに色料の三原色であるシアン、マゼンタ、イエローなんかは隣との間にもう一段階ほしい感じ(ちょうど色料の三原色のところでもっとも強く色相の差を認識できるのは、これらの3つの色が原色であることと関係があるのかな)。
気が向いたら48色相版も作ってみるかな。表示に時間がかかりそうだけど。