16進数-rgb 色変換ツール

16進数(#ffaaccみたいなやつ)を入力してください。何となく変換しますので。

何のためのツール?

16進数の色指定ってめんどくさくないですか?「あ、この色をもちょっと明るくしたいな」って時はどうしてます?どの数値をどう変えれば良いかって簡単に分かんないですよね。なので、cssで色指定するときには16進数指定じゃなくてHSLAで指定してみてはいかがでしょうか。

HSLAって?

HSLAとは、HLS色空間+アルファの値で指定するcss3の色指定方法です。

HLS色空間(エイチエルエスいろくうかん)とは、色相(Hue)、彩度(Saturation)、輝度(Lightness/Luminance または Intensity)の3つの成分からなる色空間。HSV色空間によく似ている。 HSL、HSIと呼ばれることもある。
HLS色空間 - Wikipediaより

つまり、「赤がどれだけで青がどれだけで…」って指定じゃなくて、「この色をこれくらい鮮やかにこれくらい明るく」で指定できる方法の事ですね。何か分かりやすそうじゃありません?うん、ですよねー。

というわけで、16進数で取ってきた色をhslに変換したくなり、このツールを作りました。いつかはカラーピッカーでも作ってそこから選べるようにしたり、1色選んだらそれをメインカラーとした配色パターンをはじき出すツールとかまで作りたいですねー。