はてなブックマーク

こんにちは、フロントエンジニアの栗原です。 今回はCSSのカラー指定方法のおはなしです。 CSSのカラー指定で良く見るのは、RGBaや#ffffff（#と6つの文字(16進数)で色を指定するもの）の表記ですよね。 CSS3では、HSLaと呼ばれる、色相・彩度・明度・透明度で指定することができるようになりました。 HSLaとは、色相（hue）・彩度（saturation）・明度（luminousity）・透明（alpha）からなります。 色相は色相環上の角度を0 度～360度、彩度の強さを0%～100%、明度の強さを0% ～100%で指定することができるので、色の指定からなるrgbaと違い、彩度と明度の調整がパーセントで行えるので、細かい調整や色の変化などを直感的に扱いたい時に大変便利になると思います。 記述方法 color : hsla(色相, 彩度, 明度, 透明); 例：赤 color