Css 分层不透明元素一起形成新的颜色

我有一个设计：

我想要两个重叠的svg多边形。当与其他元素重叠时，多边形2是否可以创建较暗的颜色，而重叠的白色可以创建与非不透明元素相同的颜色

更新

标记是不相关的，因为我只对颜色值感兴趣。我想知道背景色为白色时，不透明度值（alpha）与rgb（0，92，150）匹配的颜色值

body {
  background: white;
}

.container {
  background: rgb(0, 92, 150);
}

.polygon-1 {
  fill: rgb(0, 92, 150);
}

.polygon-2 {
  fill: [a color value that has an alpha that, when it's over white, creates the same color as rgb(0, 92, 150) and creates the darker color effect when it overlays rgb(0, 92, 150)];
}

我想基本上和我的一样

根据该问题中提供的JS解决方案，计算alpha需要最少数量的rgb。就我而言，是0。生成的

rgba

值为

rgba（0,92,150,1）

（无不透明度）。这是否意味着特定的颜色无法产生所需的效果

var min, a = (255 - (min = Math.min(r, g, b))) / 255;

在我的例子中，

Math.min（0,92150）

是

0

，

（255-0）/255

是1，所以我的alpha值是1。我需要它小于1（至少一点点）

更新2

为了进一步质疑反对票，这里有一个例子来说明我的观点。

我将这样做： 我正在添加第三个形状：

rect

而不是蓝色的

.container

，我正在使用

在多边形之间剪裁。在这个例子中，我用红色填充，但你可以随意填充

我希望有帮助

。外部容器{
背景：白色；
垫面：10rem；
}
.外容器*{
框大小：边框框；
}
.集装箱{
宽度：300px；
填充：4px10px 25px 10px；
文本对齐：居中；
颜色：白色；
保证金：0自动；
位置：相对位置；
}
h3{
字体大小：1.5rem；
字体系列：无衬线；
字体大小：300；
z指数：10；
位置：相对位置；
}
svg{
宽度：100%；
位置：绝对位置；
顶部：-5雷姆；
左：0；
z指数：1；
}
.多边形-1，
.多边形-2，
.多边形-3{
填充：rgb（0、92、150）；
}

教育类

经过进一步挖掘，我发现了类似的问题。我不知道为什么这会被否决，因为它本质上是一个问题：更新你的代码。你能分享一个预期输出的屏幕截图吗？@Saravana问得好，我扩展了我原来的问题，添加了更多关于我预期的细节。哇，真聪明。我真的希望有一个颜色的解决方案，但这肯定是一个倒退，如果没有其他可以找到。谢谢你的指导！