有没有建立绿色-黄色-红色配色方案的好方法？

基本的颜色理论告诉我们，绿色，黄色和红色的调色板是可笑的丑陋，它们是冲突的颜色。如果我们将绿色作为突出的颜色，则与之类似的颜色是红色和蓝色-在这种配色方案中没有黄色的余地。

那么，有什么方法可以将绿色，黄色和红色组合成一种配色方案而又不会使用户蒙蔽？

作为示例，我在网站上有一个页面，其中这些颜色用于根据给定用户的实际技能水平来衡量项目所需的技能水平。绿色达到或超过此水平，黄色表示期望值略有下降，红色表示它们不够好或完全缺乏给定的技能。

这是我的示例（忽略字母周围的橙色和灰色字段，它们是无关的）。

我们都可以肯定地说，这看起来非常糟糕，但这是我需要坚持的格式，整个绿-红-黄都需要注意。：/

与图形/网页设计师相反，我主要是一名程序员，所以我对色彩理论和用户体验的理解是有限的。

对此提出一个问题，我的问题是，在不损害用户体验的前提下，如何建立一种传统上冲突的配色方案？

（如果我的问题不合适，我将删除它，我不确定在哪里问这个问题，这似乎是最合适的）

绿色，黄色和红色不能在一起吗？埃塞俄比亚人必须受到严重侮辱。Google提供绿色，黄色和红色图像，我想您会找到几个吸引人的示例（以及丑陋的示例）。

任何颜色组合在一起的效果取决于确切的颜色坐标，相对位置，形状，有色对象的大小以及想要获得的效果（例如，沉着，激动，有趣，严肃，大胆或微妙） ）。我没有适用于您的任何硬性规定，但是这里有一些需要尝试的东西。

尺寸饱和度折衷

为避免产生震撼效果（假设您不希望这样做），有色物体的尺寸应与其色彩饱和度成反比。您的示例具有很高的饱和度，因此请尝试使用较低的颜色饱和度（例如，粉彩）或为背景以外的其他颜色着色。例如，您可以为文本着色，并使背景保持中性，或者可以为文本旁边的小形状或符号着色。后者将提供机会使用形状为可访问性和黑白打印目的冗余编码技能匹配项（绿色对勾表示“满意”，黄色感叹号表示“不足”，红色“不输入”表示不好） 。

间距

颜色的外观取决于它们彼此之间的接近程度。相邻时看起来比冲突的颜色还好，但间隔很小。尝试在每个单元格周围放置一个中性边框以进一步分离颜色（就像标题中的颜色一样），除非同色单元格融合在一起以被视为一个对象具有某种意义。尝试不同的厚度。尝试用白色边框分隔每个单元格，以平铺外观。

图案

颜色的融合程度也会随着颜色的样式而变化，因此请确保您要评估的模型具有典型的颜色比例和位置。例如，如果大多数情况下所有事物都是绿色，并且让用户注意黄色和红色的“亮点”最为重要，那么请选择具有良好背景（例如低饱和度，浅色），黄色和绿色的绿色。红色似乎位于“顶部”（例如，较高的饱和度，深色）。考虑到图案的美感也可以传达和激励用户。如果用户的技能特别不合适或不平衡，则可能需要一个难看的模式。最吸引人的模式应对应于对用户最有利的状态。

易用性

您的问题涉及美学，但是颜色编码的选择也具有重大的可用性含义。您的颜色选择应为：

• 视觉上彼此不同，尤其是在退化的视觉条件下使用时（例如，在阳光下的移动设备上）。

• 与背景（如果是前景）或前景（如果是背景）提供良好的对比度。例如，红色的黑色文本不太好。通常，前景和背景需要不同级别的亮度。

• 确保颜色等级与其编码一致。例如，用户应该参加的事情需要与背景和其他颜色形成更多的对比。

• 提供可访问性和可打印性，其中每种颜色的暗度也不同，暗度按比例缩放（红色多于黄色，多于绿色）。使您的绿色略带蓝色和/或使红色略带橙色，以便红绿色色盲用户（最常见的色盲用户）仍然可以看到色差。

• 仅对一个变量使用颜色编码。我不知道您将灰色和橙色用于什么目的，但是这可能会引起混乱，并使用户更难以使用红色绿色和黄色。每当您拥有三种以上的颜色时，很难使它们可用。寻找另一种方式来编码灰色和橙色代码（例如，使用字体大小或粗细，或将虚线用于单元格边框；请参见将G放入GUI中）。

在我从事的一个项目中，随附的颜色是＃E00000，＃FF8400和＃C0FFE0（不是非常黄的黄色，但仍然可以使用）。

我有更多关于选择颜色代码的信息，包括如何在Breaking the Color Code处计算颜色和亮度对比度。

尝试使用粉彩代替实际的RGY颜色。随着饱和度的降低，应该更容易查看信息。

淡红色十六进制：＃F7977A RGB：246-150-121

淡绿色十六进制：＃82CA9D RGB：130-202-156

淡黄色十六进制：＃FFF79A RGB：255-247-153

我看到这三种颜色面临三个主要挑战。

• 红色和绿色具有很好的亮度，可用于文本，而黄色则没有。
• 黄色对于背景色具有良好的亮度，可以为此目的淡化绿色，但红色将变为粉红色。
• 降低绿色和红色的饱和度效果很好，但是使黄色变浑浊。

假设您不喜欢大面积饱和色彩的波普艺术效果，我只能想到几个选择。通过淡出颜色，这两种方法都将饱和的影响降至最低。

• 在单元格背景中使用渐变。
• 将颜色用作文本阴影。阴影需要相当大的模糊度才能明显突出文本。

这里还有另一个与美学无关的挑战。红色将压倒其他两种颜色，并引起注意页面上的负号。如果那是您的目标，那么您就很好。如果您希望自己的图表具有积极性，那么您将很努力。

“红色”，“黄色”，“绿色”留有很大的解释空间，因此您有很好的机会找到一种效果很好的组合。

对于您的美学问题，我将您的“红色”和“绿色”颜色放入了搅拌机中。然后，我选择pHSL作为混合的颜色模型。这已经改善了颜色设置。

接下来，我尝试了不同的“红色”和“绿色”以进一步改善印象。稍微深一点，红色更饱和/更浓。绿色略带黄色，再加上更高的饱和度。

好的，还不错，但是还没有准备好。

对于您的可用性问题，请记住，存在（相对）亮度，色相和饱和度的层次结构来引导我们的注意力。由于黄色自然具有最高的亮度值，因此这些字段最吸引我们的注意力。因此，我将颜色导入了颜色转换器，以分别调整每种颜色。在我的示例中，我给出了“黄色”和“绿色”相等的亮度值。黄色的较低亮度或绿色的较高亮度在美学上似乎是有问题的。

我在Photoshop中尝试了组合，并意识到白色（间距）边框给人留下了深刻的印象。因此，我建议为单元格设置白色间距，并最多使用一条细黑线来划分条目​​的每一行。

通过使用上述工具，您可能会找到一种甚至更好地满足您的个人品味或要求的颜色组合（例如，较高的绿色饱和度）...

在将颜色用作背景时，您必须小心，因为它会使可读性变差，并使用户从消息中分散注意力。即红色背景和黑色字体。

将颜色转换为灰度通常有助于了解哪种颜色对比度最佳。即，当您将红色转换为灰度时，颜色为深灰色。因此，当您的字体为黑色时，这是一种不好的颜色，不能用作背景。您需要选择一种可以提供良好对比度的颜色。

但是，如果您想让用户快速了解您要执行的操作，建议您将单元格保留为空白（浅色），并添加一个小符号来指示状态（正方形或5％或单元格中填充了颜色）

这样，用户可以快速阅读文本并查看其所属的类别。

但是，如果您想组合颜色，建议您购买本书“颜色索引”。在该处，您将找到成千上万种组合在一起的组合，并且可以节省一些时间。

如果找到正确的颜色阴影，则可以确定同时使用红色，黄色和绿色。

我建议您在其中一些网站中找到一些不错的组合：

http://www.colorschemer.com/schemes/search.php?s=red+yellow+green&submit=搜索

或尝试自己创建其中一些：

http://colorschemedesigner.com/

我真正推荐的是选择颜色组合后，再问其他人对它的看法。有时我们的外观不够好，即使颜色一点也不好，我们也喜欢颜色。

选择适当的阴影时，不要忘记考虑文本的对比度和可见性。

我建议您使用浅黄色，因为您将其用作中性色。

这是三个方案，希望您喜欢它。