ラボ > CSS:Sass

Sassで色を明度、彩度、透明度を変更

作成日:2017-11-21, 更新日:2017-11-21

20%明るくする
h1 {color: lighten(@basecolor, 20%); }
30%暗くする
h2 {color: darken(@basecolor, 30%); }
彩度を20%高くする
h1 {color: saturate(@basecolor, 20%); }
彩度を30%低くする
h2 {color: desaturate(@basecolor, 30%); }
透明度を20%減らす
h1 {background-color: fadein(@basecolor, 20%); }
透明度を30%増やす
h2 {background-color: fadeout(@basecolor, 30%); }