SASS计算2种颜色之间的HSL差异

我正在使用SASS进行某些样式设置。我有基色,并且我希望所有其他颜色都相对于基色进行更改。我已经按照需要设置了颜色,但是颜色是硬编码的,而不是根据基本颜色计算得出的。

是否有一种工具可以快速为两种颜色之间的差异生成SASS颜色功能?但是它仅允许我使用滑块生成输出颜色,而不是自己设置输出颜色并生成函数。

希望这是有道理的。

回答:

您可以签出以下资源:

基本上,这是它的实质:

@function color-diff($a, $b) {

$sat: saturation($a) - saturation($b);

$lig: lightness($a) - lightness($b);

$fn-sat: if($sat > 0, 'desaturate', 'saturate');

$fn-lig: if($lig > 0, 'darken', 'lighten');

@return (

adjust-hue: -(hue($a) - hue($b)),

#{$fn-sat}: abs($sat),

#{$fn-lig}: abs($lig)

);

}

您想要使用SASS中的一个函数(或LESS中的一个参数化的mixin)来执行此操作,并且您可以看到上面一个的结构。

希望这可以帮助。

以上是 SASS计算2种颜色之间的HSL差异 的全部内容, 来源链接: utcz.com/qa/402129.html

回到顶部