css - 如何确定给定颜色的颜色转换？

Question

我们的设计师为我们提供了一些不错的 web 2.0 按钮等。我将它们翻译成漂亮的 CSS3。现在我想使用Sass 颜色操作来泛化配色方案。

给定设计中的基本品牌颜色 (#7e1a00) 和一组用于按钮、链接、渐变等的衍生颜色 (#D05B3D,#973D24,#7E1900)，我如何确定必须应用哪些转换品牌颜色会导致衍生颜色吗？

我可以猜测和检查，或者编写一个蛮力程序来尝试所有组合 - 似乎这可能是一种聪明而简单的方法来确定。

有什么想法吗？

编辑 这不需要是一个通用的解决方案——我可以通过查看颜色来合理地确定要应用的转换。我需要确定转换的参数。

Answer 1

理论上，从一个值到另一个值的函数有无数个，但实际上只有少数是合理的。问题是，您可能知道要使用哪个函数，但确定参数是计算机更擅长的数字运算。

我创建了一个建议颜色函数的工具。它列出了从一种颜色到另一种颜色的大多数 SASS 函数，以便您可以专注于在您的设计中是否使用darken或softlight更有意义。

Answer 2

最简单的方法可能是将颜色转换为 HSL 并查看那里的差异。所有 Sass 颜色处理函数都在 HSL 空间中工作，因此应该很容易判断您是否需要例如增加亮度或降低饱和度。