HSLでの色指定を試してみる

いままで

body {
    background: #000;
}

body {
    background: rgb(0, 0, 0);
}

body {
    background: rgba(0, 0, 0, 1);
}

body {
    background: black;
}

などなど、
カラーコードやRGB（RGBa）、キーワードでの色指定は行ってきたことがあったのですが、

body {
    background: hsl(0, 0%, 0%);
}

body {
    background: hsla(0, 0%, 0%, 1);
}

と、HSL（HSLa）でのしてはしたことがありませんでした。

HSLについては、
HLS色空間 - Wikipedia とか
HSV色空間 - Wikipedia とかを読んだだでではなんとなくわかったようなわからないようななので、簡単に試せるサンプルをつくってみました。

DEMO

以外にも（？） IE9から対応 していまるようです。

http://caniuse.com/#search=HSL

とてもわかりやすいですが、文字が読みにくいときがありますね。裏目にでました。
今回は以上です。