如何计算渐变色替换？

Question

我有以下CSS：

background-image: linear-gradient(#444f67, #262c39);

这些是现有渐变的开始和结束颜色。现在我想调整渐变，因为我调整了这个站点的颜色方案。

我知道新的起始颜色：

background-image: linear-gradient(#542437, X);

我如何解决X？基于....

oldStart -> oldEnd = ExistingGradient :: newStart -> X (new end) = NewGradient

提前致谢...

Answer 1

以下是我通常使用纯CSS解决这个问题的方法 - 使用透明渐变并仅更改底层背景颜色。

例如，而不是：

background-image: linear-gradient(#444f67, #262c39);

使用：

background-color: #444f67;
background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.4));

然后你可以将背景颜色换成另一个主题：

background-color: #542437;
background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.4));

以下是一个有效的例子：jsfiddle。

---

否则，如果您询问如何计算实际颜色，则需要定义您的要求。你想做服务器端还是客户端？使用C＃相当容易，也可以使用JavaScript。