用程序计算应用半透明覆盖层后达到特定颜色所需的基础颜色

Question

我正在尝试创建一个工具来帮助我为web应用程序选择颜色。基本上，我希望能够指定最终颜色和一些覆盖参数，并确定底层颜色需要是什么(或者是否可以使用指定的参数实现)。

所有覆盖层均为半透明黑色。

系统如何工作的一个例子：

1. 我输入以下变量：
   • 最终颜色红色：128[0-255]
   • 最终颜色绿色：118[0-255]
   • 最终颜色蓝色：107[0-255]
   • overlay不透明度：0.21[0-1]
2. 系统返回：
   • rgb(183169154)

我应该注意，我不需要帮助来编写实际的代码，我只是不知道要使用的数学公式，而且我的Google fu今天很弱。我能找到的最接近的答案就是这个绝妙的答案(https://stackoverflow.com/a/12228643/4027341)但它错过了一个迭代"知道最终想要的颜色，知道叠加颜色，知道覆盖不透明度">

Answer 1

您可以一次使用一个通道；公式是这样的：

通道的最终颜色将计算为：

finalColor = originalColor * (1.0 - opacity) + overlayColor * opacity;

在您的情况下，您知道最终颜色、覆盖颜色和不透明度；通过代数运算，我们得出结论：

originalColor = (finalColor - overlayColor * opacity) / (1.0 - opacity);

只需注意不透明度=1.0的边缘情况；在这种情况下，您根本无法计算原始颜色；更具体地说，如果不透明度=1.0，任何颜色都可以。

此外，该公式可能最终产生负值或大于255的值；这些值意味着你无法完全获得一种能给出你想要的结果的颜色。