css - 如何比较两种颜色？

Question

在我的网络元素中，我列出了将近 20 种不同的颜色。

我如何比较这些颜色中的每一种，以了解这种颜色比另一种颜色更深、更饱和、更绿……？

我的目标是将这些计算值与 Less 函数一起使用。

Answer 1

您可以将颜色用作 3D 矢量来计算颜色之间的距离。向量的内容可以是 R、G 和 B 分量或 H、S 和 V 分量(或您能想到的任何其他分类)。

现在让距离 d(c1, c2) 为颜色 c1 和 c2 之间计算的距离:

d(c1, c2) = sqrt((c1_1 - c2_1)^2 + (c1_2 - c2_2)^2 + (c1_3 - c2_3)^2)

您可能认为这是 Euclidean distance .任何其他 norm会做的。