Scss中的颜色函数

Posted 2023-03-26

参考技术A 一、RGB颜色函数

1、rgb($red,$green,$blue): 根据红、绿、蓝三个值创建一个颜色

2、rgba($red,$green,$blue,$alpha): 根据红、绿、蓝和透明度值创建一个颜色

3、red($color): 从一个颜色中获取其中红色值

4、green($color): 从一个颜色中获取其中绿色值

5、blue($color):  从一个颜色中获取其中蓝色值

6、mix($color-1,$color-2,[$weight]): 把两种颜色混合起来

二、HSL函数

1、hsl($hue,$saturation,$lightness)：通过色相（hue）、饱和度(saturation)和亮度（lightness）的值创建一个颜色

2、hsla($hue,$saturation,$lightness,$alpha)：通过色相（hue）、饱和度(saturation)、亮度（lightness）和透明（alpha）的值创建一个颜色

3、saturation($color)：从一个颜色中获取饱和度（saturation）值

4、lightness($color)：从一个颜色中获取亮度（lightness）值

5、adjust-hue($color,$degrees)：通过改变一个颜色的色相值，创建一个新的颜色

6、lighten($color,$amount)：通过改变颜色的亮度值，让颜色变亮，创建一个新的颜色

7、darken($color,$amount)：通过改变颜色的亮度值，让颜色变暗，创建一个新的颜色

三、Opacity函数

1、alpha($color)/opacity($color): 获取颜色透明度值

2、rgba($color,$alpha): 改变颜色的透明度

3、opacify($color, $amount) / fade-in($color, $amount)：使颜色更不透明

4、transparentize($color, $amount) / fade-out($color, $amount)：使颜色更加透明