说我有一个背景颜色,一个“色带”在其上运行另一种纯色。现在,我想要功能区是部分透明的,让一些细节融合,但仍然保持功能区的“相同的颜色”在背景。
有一种方法(容易)确定,对于给定的不透明度/ 100%的色带颜色,什么RGB值应该是相同的,它的颜色与100%不透明背景?
这是一张图片。背景是rgb(72,28,97),色带rgb(45,34,70)。我想要一个rgba(r,g,b,a)的功能区,使其看起来与这个纯色相同。
解决方法
颜色混合只是每个通道的线性插值,对吧?所以数学很简单。如果RGBA1高于RGB2,有效的视觉效果RGB3将是:
r3 = r2 + (r1-r2)*a1 g3 = g2 + (g1-g2)*a1 b3 = b2 + (b1-b2)*a1
…其中alpha通道从0.0到1.0。
正确性检查:如果alpha是0,是RGB3与RGB2相同?是。如果alpha是1,是RGB3与RGB1相同?是。
如果只锁定背景颜色和最终颜色,则有大量的RGBA颜色(无限,在浮点空间中)可以满足要求。所以你必须选择条的颜色或不透明度级别,并找出另一个的值。
选择基于Alpha的颜色
如果你知道RGB3(最终所需的颜色),RGB2(背景颜色)和A1(你想要多少不透明度),你只是寻找RGB1,那么我们可以重新排列方程:
r1 = (r3 - r2 + r2*a1)/a1 g1 = (g3 - g2 + g2*a1)/a1 b1 = (b3 - b2 + b2*a1)/a1
有一些颜色组合在理论上可能,但不可能给定标准RGBA范围。例如,如果背景是纯黑色,期望的感知颜色是纯白色,并且期望的alpha是1%,那么您将需要:
r1 = g1 = b1 = 255/0.01 = 25500
…超亮白色100×比任何可用。
基于颜色选择Alpha
如果你知道RGB3(最终所需的颜色),RGB2(背景颜色)和RGB1(你想改变不透明度的颜色),而你只是寻找A1,这样安排方程:
a1 = (r3-r2) / (r1-r2) a1 = (g3-g2) / (g1-g2) a1 = (b3-b2) / (b1-b2)
如果这些给出不同的值,那么你不能使它匹配完全,但是你可以平均的alphas,尽可能接近。例如,在世界上没有不透明度,将让你把绿色超过红色以获得蓝色。