使用css函数将白色的rgba/hsla转换为不透明的rgb/hsl

问题描述 投票:0回答:1

是否可以使用“颜色混合”或其他 CSS 函数将白色的 rgba/hsla 转换为 不透明 rgb/hsl?

例如:rgba(31, 198, 149, 0.5) => rgb(143, 227, 202)

body {
  background: repeating-linear-gradient(
    45deg,
    lightgray 0px 2px,
    white 2px 12px
  );
  --background-primary: rgba(31, 198, 149, 0.5);
}

.box {
  width: 200px;
  height: 50px;
  margin-top: 10px;
}

.transparent {
  background: var(--background-primary);
}

.solid {
  /*background: some_function(var(--background-primary)); it's what I need*/
  background: rgb(143, 227, 202);
}
<body>
  <div class="box transparent">
    rgba(31, 198, 149, 0.5)
  </div>
  <div class="box solid">
    rgb(143, 227, 202)
  </div>
</body>

css
1个回答
0
投票

使用 CSS 函数将白色上的 RGBA/HSLA 颜色转换为纯 RGB/HSL

有没有办法使用颜色混合等 CSS 函数将白色背景上的 rgba 或 hsla 颜色转换为不透明的 rgb 或 hsl 值?

rgba(31, 198, 149, 0.5) => rgb(143, 227, 202)

body {
  background: repeating-linear-gradient(
    45deg,
    lightgray 0px 2px,
    white 2px 12px
  );
  --background-primary: rgba(31, 198, 149, 0.5);
}

.box {
  width: 200px;
  height: 50px;
  margin-top: 10px;
}

.transparent {
  background: var(--background-primary);
}

.solid {
  /* Need a way to achieve this: */
  background: rgb(143, 227, 202);
}
© www.soinside.com 2019 - 2024. All rights reserved.