Javascript 在颜色范围内找到最接近的颜色匹配

我有十个颜色的十六进制/rgb值（它们是肤色）-我希望能够找到与特定十六进制/rgb值最接近的匹配

我是否会从开始的颜色开始迭代，直到我落在一个特定的范围内？但是我如何组织这些范围呢

老实说，我完全不知道该怎么做，甚至不知道该搜索什么，所以任何帮助，或是向正确的方向点头，都将不胜感激

---

干杯

我可以让你使用两种颜色之间的欧几里得距离。如果有任何两种颜色，例如#89a839和#ad9009，可以将其转换为三维向量，得到这两个向量（ad，90,09）和（89，a8,39）； 然后将数字转换为十进制范围。计算这两点之间的欧几里德距离

d = sqrt((x1-x2)^2,(y1-y2)^2,(z1-z2)^2,)

只要计算你的颜色和所有颜色之间的距离，找到最小的值，你的颜色就会和特定的颜色最接近

---

如果您在编写此代码时遇到任何问题，请随时提问。

首先，这不一定是编程问题，但

欧几里德距离是一种很好的方法。例如：

使用常规html颜色名称，蓝紫色（#8A2BE2）和黄花（#DAA520），这更接近LightSeaGreen（#20B2AA）？将3个十六进制值拆分为三维向量，如下所示：

BV = 138,43,226
GR = 218,165,32
LSG = 32,178,170

使用以下公式：

d(p,q) = sqrt((px - qx)^2 + (py - qy)^2 + (pz - qz)^2)

d(BV,LSG) = sqrt((138-32)^2 + (43-178)^2 + (226-170)^2)
d(BV,LSG) = sqrt(11236 + 18225 + 3136)
d(BV,LSG) = sqrt(32597)
d(BV,LSG) = 180.546

d(GR,LSG) = sqrt((218-32)^2 + (165-178)^2 + (32-170)^2)
d(GR,LSG) = sqrt(34596 + 169 + 19044)
d(GR,LSG) = sqrt(53809)
d(GR,LSG) = 231.967

---

正如你所看到的，

d（BV，LSG）

比

d（GR，LSG）

小，所以蓝紫色比黄花更接近浅绿色。

虽然RGB上的欧几里德距离可能会有所帮助，但使用合适的颜色模型会更好。我会建议LCH或至少HSL。然后为每个通道分配权重。例如，对于人眼来说，亮度是以对数尺度感知的。降低其效果可能会提供更好的匹配。因此，以下情况永远不会发生：

#400根（深红色）火柴#222根（几乎是黑灰色，距离12）

---

这不是#800（深红色，距离16）

而是用于计算其他两种颜色的平均颜色。这对我有什么帮助？事实上，当我使用欧几里德公式时，我得到了很多不正确的匹配@cem kalyoncu，你知道我们在哪里可以找到更好的公式吗？使用HSL颜色系统并为通道分配一个倍增。使用H的heigher值。如果您想要更好的结果，请使用LCH颜色系统。配方奶粉随处可见。我觉得这很吸引人。您能否提供一个关于如何在JavaScript中实现这一点的示例？我发现了，但这背后的科学是我无法理解的。最近有一个问题我觉得很有趣，但我提供了一个非常有限的答案。也许你可以在那里照些灯？；）转换不是很困难，它需要大量的乘法运算。以下是您可以使用的经过测试的公式：*