颜色操作通常采用与它们正在更改的值相同的单位的参数，并且百分比作为绝对值处理，因此将 10% 的值增加 10% 会导致 20%。 将选项方法参数设置为 relative 以获得相对百分比。 当使用相对百分比时，将 10% 的值增加 10% 会导致 11%。 值被限制在允许的作用域内； 他们不环绕。 在显示返回值的地方，除了你通常会使用的十六进制版本之外，我们还使用了使每个函数的功能一目了然的格式。
saturate
按绝对量增加 HSL 颜色空间中颜色的饱和度。
参数：
color: 颜色对象。amount: 百分比 0-100%。method: 可选，设置为relative以相对于当前值进行调整。
返回： color
例子： saturate(hsl(90, 80%, 50%), 20%)
输出： #80ff00 // hsl(90, 100%, 50%)
➜
desaturate
按绝对量降低 HSL 颜色空间中颜色的饱和度。
参数：
color: 颜色对象。amount: 百分比 0-100%。method: 可选，设置为relative以相对于当前值进行调整。
返回： color
例子： desaturate(hsl(90, 80%, 50%), 20%)
输出： #80cc33 // hsl(90, 60%, 50%)
➜
lighten
按绝对量增加 HSL 颜色空间中颜色的亮度。
参数：
color: 颜色对象。amount: 百分比 0-100%。method: 可选，设置为relative以相对于当前值进行调整。
返回： color
例子： lighten(hsl(90, 80%, 50%), 20%)
输出： #b3f075 // hsl(90, 80%, 70%)
➜
darken
按绝对量降低 HSL 颜色空间中颜色的亮度。
参数：
color: 颜色对象。amount: 百分比 0-100%。method: 可选，设置为relative以相对于当前值进行调整。
返回： color
例子： darken(hsl(90, 80%, 50%), 20%)
输出： #4d8a0f // hsl(90, 80%, 30%)
➜
fadein
降低颜色的透明度（或增加不透明度），使其更不透明。
对不透明颜色没有影响。 要朝另一个方向淡入淡出，请使用 fadeout。
参数：
color: 颜色对象。amount: 百分比 0-100%。method: 可选，设置为relative以相对于当前值进行调整。
返回： color
例子： fadein(hsla(90, 90%, 50%, 0.5), 10%)
输出： rgba(128, 242, 13, 0.6) // hsla(90, 90%, 50%, 0.6)
fadeout
增加颜色的透明度（或降低不透明度），使其不透明。 要朝另一个方向淡入淡出，请使用
fadein。
参数：
color: 颜色对象。amount: 百分比 0-100%。method: 可选，设置为relative以相对于当前值进行调整。
返回： color
例子： fadeout(hsla(90, 90%, 50%, 0.5), 10%)
输出： rgba(128, 242, 13, 0.4) // hsla(90, 90%, 50%, 0.4)
fade
设置颜色的绝对不透明度。 可以应用于颜色，无论它们是否已经具有不透明度值。
参数：
color: 颜色对象。amount: 百分比 0-100%。
返回： color
例子： fade(hsl(90, 90%, 50%), 10%)
输出： rgba(128, 242, 13, 0.1) //hsla(90, 90%, 50%, 0.1)
spin
沿任一方向旋转颜色的色调角度。
虽然角度作用域是 0-360，但它应用了 mod 360 操作，因此你可以传入更大（或负）的值，它们将环绕，例如 360 度和 720 度的角度将产生相同的结果。 请注意，颜色是通过 RGB 转换传递的，它不会保留灰色的色调值（因为没有饱和度时色调没有意义），因此请确保以保留色调的方式应用函数，例如不要 做这个：
@c: saturate(spin(#aaaaaa, 10), 10%);
改为这样做：
@c: spin(saturate(#aaaaaa, 10%), 10);
颜色始终作为 RGB 值返回，因此将 spin 应用于灰度值将不会执行任何操作。
参数：
color: 颜色对象。angle: 要旋转的度数（+ 或 -）。
返回： color
例子：
spin(hsl(10, 90%, 50%), 30)
spin(hsl(10, 90%, 50%), -30)
输出：
#f2a60d // hsl(40, 90%, 50%)
#f20d59 // hsl(340, 90%, 50%)
➜
➜
mix
将两种颜色按可变比例混合在一起。 不透明度包括在计算中。
参数：
color1: 颜色对象。color2: 颜色对象。weight: 可选，两种颜色之间的百分比平衡点，默认为 50%。
返回： color
例子：
mix(#ff0000, #0000ff, 50%)
mix(rgba(100,0,0,1.0), rgba(0,100,0,0.5), 50%)
输出：
#800080
rgba(75, 25, 0, 0.75)
+
➜
tint
以可变比例将颜色与白色混合。 与调用
mix(#ffffff, @color, @weight)相同
参数：
color: 颜色对象。weight: 可选，颜色和白色之间的百分比平衡点，默认为 50%。
返回： color
例子：
no-alpha: tint(#007fff, 50%);
with-alpha: tint(rgba(00,0,255,0.5), 50%);
输出：
no-alpha: #80bfff;
with-alpha: rgba(191, 191, 255, 0.75);
➜
shade
以可变比例混合颜色和黑色。 与调用
mix(#000000, @color, @weight)相同
参数：
color: 颜色对象。weight: 可选，颜色和黑色之间的百分比平衡点，默认为 50%。
返回： color
例子：
no-alpha: shade(#007fff, 50%);
with-alpha: shade(rgba(00,0,255,0.5), 50%);
输出：
no-alpha: #004080;
with-alpha: rgba(0, 0, 64, 0.75);
➜
greyscale
从 HSL 颜色空间中的颜色中移除所有饱和度； 与调用
desaturate(@color, 100%)相同。
由于饱和度不受色调影响，因此生成的颜色映射可能有些暗淡或浑浊； luma 可能会提供更好的结果，因为它提取的是感知亮度而不是线性亮度，例如 greyscale('#0000ff') 将返回与 greyscale('#00ff00') 相同的值，尽管它们在人眼看来的亮度有很大不同。
参数： color: 颜色对象。
返回： color
例子： greyscale(hsl(90, 90%, 50%))
输出： #808080 // hsl(90, 0%, 50%)
➜
请注意，生成的灰色看起来比原始绿色更暗，即使其亮度值相同。
与使用 luma 比较（用法不同，因为 luma 返回单个值，而不是颜色）：
@c: luma(hsl(90, 90%, 50%));
color: rgb(@c, @c, @c);
输出： #cacaca
➜
这次灰色的明度看起来和绿色差不多，但实际上它的值更高。
contrast
选择两种颜色中哪一种颜色与另一种颜色形成最大对比。
这对于确保颜色在背景下可读很有用，这对于可访问性合规性也很有用。 此功能与 Compass for SASS 中的对比函数 的工作方式相同。 根据 WCAG 2.0，使用伽玛校正后的 luma 值而不是亮度来比较颜色。
明暗参数可以按任意顺序提供 - 该函数将计算它们的亮度值并自动分配明暗，这意味着你不能使用此函数通过颠倒顺序来选择对比度最低的颜色。
参数：
color: 要比较的颜色对象。dark: 可选 - 指定的深色（默认为黑色）。light: 可选 - 指定的灯光颜色（默认为白色）。threshold: 可选 - 指定从 "dark" 到 "light" 的转换位置的百分比 0-100%（默认为 43%，匹配 SASS）。 这用于以一种或另一种方式偏置对比度，例如，允许你决定 50% 的灰色背景是否应产生黑色或白色文本。 你通常会将 'lighter' 调色板设置得较低， 'darker' 调色板设置得较高。
返回： color
例子：
p {
a: contrast(#bbbbbb);
b: contrast(#222222, #101010);
c: contrast(#222222, #101010, #dddddd);
d: contrast(hsl(90, 100%, 50%), #000000, #ffffff, 30%);
e: contrast(hsl(90, 100%, 50%), #000000, #ffffff, 80%);
}
输出：
p {
a: #000000 // black
b: #ffffff // white
c: #dddddd
d: #000000 // black
e: #ffffff // white
}
这些示例使用上面计算的背景和前景颜色； 你可以看到你永远不会以白底白字或黑底黑字结束，尽管可以使用阈值来允许较低对比度的结果，如上一个示例所示：