css - 获得具有相同色调但另一种颜色的颜色？

Question

在我的 CSS 中，我将#errordiv 定义为：

#error {
    border-width:1px;
    border-style:solid;
    border-color: #DD3C10;
    background:#FFEBE8;
    /* Other settings */
}

实际上，上面的代码不是我的——我使用了与 Facebook 相同的颜色。现在，我想对#successdiv 做同样的事情，但我不知道要使用哪种颜色。我想保持相同的色调（即“全彩”和“白色”之间的线上的位置），但不是绿色而不是红色。我该怎么做？有“公式”吗？

score 1 · Accepted Answer

您关心颜色的 HSL 表示中的 L（亮度）分量。您可以在此处找到在线转换器（RGB/HEX 到 HSL）：little link。

HSL 为#DD3C10is 13° 86% 46%，而#FFEBE8is 8° 100% 95%。如您所见，亮度差异是49%.

假设您的绿色为borderis #00FF00，它120° 100% 50%在 HSL 中。要计算新的亮度分量，只需添加49%. 因此，绿色background是120° 100% 99%哪个是#FAFFFA。

score 0 · Accepted Answer

肯定有一个简单的方法。只需使用 HSL 颜色系统，而不是 RGB - 使用它来选择所需的颜色更加直观，它是为图像着色时选择使用的颜色系统。

然后您所要做的就是将基色表示为 HSL 颜色，然后只需更改饱和度或亮度，同时保持色相不变。

例如

新的

2 回答 2