基于单一输入颜色生成类似配色方案的算法是什么？答案

【问题标题】：What is the alghoritm to generate an analogic color scheme based on a single input color?基于单一输入颜色生成类似配色方案的算法是什么？
【发布时间】：2012-06-14 21:08:01
【问题描述】：

我正在创建一个网站，因为我非常喜欢使用 SASS/Compass 来组织我的 CSS，所以我想到了让我的网站成为主题的想法。

起初，我想简单地拥有一组表示主题调色板颜色的 8 个变量。接下来，所有 CSS 规则都将使用这些颜色，或者它的变亮/变暗版本（用于阴影、叠加层、渐变和发光）。

然后我想到了一个疯狂的想法，即拥有一个单一的主题基色，之后调色板的其余部分就是根据它计算出来的。例如：

在这个工具中，我选择了一个单一的基色（圆圈内部的绿色），然后它基于它生成了一个完整的调色板（见右图），在这种情况下它是一种“模拟”颜色方案。

我的问题是这个工具使用的算法是否可以在 SASS 中复制，这样我就可以有一个可配置的颜色，而 SASS 计算颜色方案的其余部分。

我知道你们中的一些人可能会怀疑这个练习的用处，但我认为这是一个有趣的实验。

【问题讨论】：

完全没有，我认为它很棒。事实上，考虑到实际这样做的网站的数量，显然其他人也这么认为。您需要解决的是您希望使用哪种标准颜色公式。由于 SASS 为您提供变量，因此从脚本驱动它应该是直截了当的。选择公式可能不是;)
对于您或其他正在寻找此问题答案的人：check out this Color Scheme system for SASS。

标签： algorithm sass color-scheme

【解决方案1】：

一方面，那个色轮是不正确的。红色的补色是青色，而不是绿色。此外，正确的术语是“类比”，而不是“类比”。我个人认为this website更好。

要创建基本的类似配色方案，您首先需要具备一种将颜色与 HSL（或类似的基于色调）形式相互转换的方法。假设你有这个，类似的 3 色方案的基本算法是：

Inputs: BaseColor, HueVariation

Color1 = BaseColor
Color2 = ColorFromHSL(Hue(BaseColor) + HueVariation, Saturation(BaseColor), Lightness(BaseColor))
Color3 = ColorFromHSL(Hue(BaseColor) - HueVariation, Saturation(BaseColor), Lightness(BaseColor))

Wikipedia 有更多信息。

【讨论】：

【解决方案2】：

您正在寻找的是色彩和谐。有许多预定义的方案可以帮助您生成这样的和声。通常，它们基于 HSL 颜色空间而不是 RGB 颜色空间。

您可以使用以下链接：

http://www.tigercolor.com/color-lab/color-theory/color-harmonies.htm

http://sputnik.freewisdom.org/lib/colors/

您可能还想尝试在 google 中搜索其他方案。

大多数情况下，方案适用于任何给定的输入颜色，因此您可以为一种颜色创建自定义方案并将其应用于另一组颜色。

【讨论】：

谢谢。是的，我确实在寻找色彩和谐。但问题是如何从单一输入颜色计算一个？
我添加了一个新链接，我认为有足够的信息可以开始 :)