1. 颜色混合(Mixing):
@color1: #3498db;
@color2: #e74c3c;
// 混合两种颜色
@mixedColor: mix(@color1, @color2, 50%);
2. 亮度调整(Lighten)和变暗(Darken):
@baseColor: #3498db;
// 增加亮度
@lightenedColor: lighten(@baseColor, 20%);
// 变暗
@darkenedColor: darken(@baseColor, 10%);
3. 饱和度调整(Saturate)和去饱和度(Desaturate):
@baseColor: #3498db;
// 增加饱和度
@saturatedColor: saturate(@baseColor, 10%);
// 降低饱和度
@desaturatedColor: desaturate(@baseColor, 20%);
4. 反相颜色(Complement):
@baseColor: #3498db;
// 获取反相颜色
@complementColor: complement(@baseColor);
5. 灰度颜色(Greyscale):
@baseColor: #3498db;
// 转换为灰度
@greyscaleColor: greyscale(@baseColor);
这些函数允许你以动态方式操作颜色,使你能够在设计样式表或主题时更加灵活。你可以根据需要选择合适的颜色函数来实现你的效果。
转载请注明出处:http://www.zyzy.cn/article/detail/4308/Less