我有兩種顏色:#FFF8F6和#AD3300。#AD3300也可以寫成rgba(173，51，0，1)。 我想覆蓋第二種顏色(不透明度為14%)在第一種顏色之上，得到第三種顏色。所以低于#FFF8F6，高于rgba(173，51，0，0.14)。

有沒有可能用SASS或者CSS的某種函數得到這個色碼(方框里有紅色邊框的那個)？

對于我可以使用的背景:

linear-gradient(0deg, rgba(173, 51, 0, 0, 0.14), rgba(173, 51, 0, 0.14)), #FFF8F6;

對于顏色屬性，我該怎么做呢？

是的，原來你可以用原始CSS！

您可以使用顏色混合()

我用下面這條線來計算顏色組合:

background: color-mix(in srgb, #FFF8F6, #AD3300 14%);

用#FFF8F6作為你的第一種顏色，用#AD3300 14%作為你的第二種顏色，它由給定的顏色和它的不透明度分解。

我試著使用rgba(173，51，0，0.14)，但是混合效果不太好。

.box {
  height: 200px;
  width: 200px;
  position: absolute;
  /* border: 1px solid gray; */
}

.box1 {
  top: 50px;
  left: 50px;
  background: #FFF8F6;
}

.box1 div {}

.box2 {
  top: 150px;
  left: 150px;
  background: #AD330024;
}

.box2 div {
  margin: 160px 0 0 0;
  text-align: right;
}

.box3 {
  height: 100px;
  width: 100px;
  top: 50px;
  left: 250px;
  background: color-mix(in srgb, #FFF8F6, #AD3300 14%);
}

.box3 div {
  text-align: right;
}

<div class="box box1">
  <div>#FFF8F6</div>
</div>
<div class="box box2">
  <div>#AD330024<br/>(rgba(173, 51, 0, 0.14))</div>
</div>
<div class="box box3">
  <div>color-mix</div>
</div>