灰度到黑色不透明度的转换答案

【问题标题】：Greyscale to black-opacity conversion灰度到黑色不透明度的转换
【发布时间】：2018-02-17 00:18:49
【问题描述】：

我发现了

color: rgb(51, 51, 51);

和

color: #333333;

和

color: black; opacity: 0.8;

都产生等效的灰色阴影。

我如何概括这一点？

换句话说，给定任意的 RGB 或 HEX 颜色/灰色阴影，当color: black; 时，我如何确定opacity 的等效值？

Here is the Codepen Demo.

<style>
  div {
    font-family: sans-serif;
    font-size: 48px;
    margin: 20px;
    padding: 60px;
  }
  .rgb {
    color: rgb(51, 51, 51); /* given this value... */
  }
  .hex {
    color: #333333; /* ...or given this value */
  }
  .opacity {
    color: black;
    opacity: 0.8; /* how can I determine this value? */
  }
<style>

<body>
  <div class="rgb">rgb(51, 51, 51)</div>
  <div class="hex">hex #333333</div>
  <div class="opacity">opacity 0.8</div>
</body>

【问题讨论】：

看看viget.com/articles/equating-color-and-transparency

标签： css colors hex rgb opacity

【解决方案1】：

您也可以使用这个Hextool 网站。使用RGBA。第四个值是该颜色的不透明度。

例如：-

rgba(51, 51, 51, 0.87)

87% 不透明度

十六进制不透明度值

100% — FF
95% — F2
90% — E6
85% — D9
80% — CC
75% — BF
70% — B3
65% — A6
60% — 99
55% — 8C
50% — 80
45% — 73
40% — 66
35% — 59
30% — 4D
25% — 40
20% — 33
15% — 26
10% — 1A
5% — 0D
0% — 00

【讨论】：

【解决方案2】：

在遇到类似问题后，我已经构建了一个工具来在您的浏览器中实现这一目标。你只需要输入你的十六进制颜色，它就会给你一个 rgba 等价物。随意测试一下;)

https://aclarembeau.github.io/grayscale-to-opacity/

【讨论】：