LESS颜色功能之间的区别是什么?

jar*_*obs 7 colors less

双方lightentint似乎使一个颜色较淡(接近白色).为什么LESS定义两者?

LESS文档:

lighten(@color, 10%); // return a color 10% points *lighter*

tint(@color, 10%); // return a color mixed 10% with white

一个网站如何定义色调(注意使用"更轻"一词):

如果您着色了一种颜色,那么您一直在为原始颜色添加白色.

色调比原始颜色浅.

kap*_*pex 7

两种功能都以某种方式产生"较浅"的颜色,但使用不同的方法.

看看源代码,了解它们的工作原理:

tint: function(color, amount) {
    return this.mix(this.rgb(255,255,255), color, amount);
},
Run Code Online (Sandbox Code Playgroud)
lighten: function (color, amount) {
    var hsl = color.toHSL();

    hsl.l += amount.value / 100;
    hsl.l = clamp(hsl.l);
    return hsla(hsl);
},
Run Code Online (Sandbox Code Playgroud)

因此tint混合为白色(如文档所述)并lighten增加HSL颜色模型的亮度.


Sco*_*ttS 7

这个要求的线程tint来到这个评论:

色调/阴影与变亮/变暗不同.色调和阴影分别有效地与白色和黑色混合,而变亮/变暗是在不依赖于色调和饱和度的情况下操纵亮度通道.前者可以产生色调变化,而后者则不能.这并不是说它没用,只是它不是一回事.在数学上,RGB空间中的线性变化不一定与HSL空间中的线性变化相对应,但在实践中它们将产生非常相似的结果.

两者背后的数学略有不同.