[css-color-5] Add alpha() RCS function, #10689

Author: svgeesus

css-color-5/Overview.bs

@@ -1703,6 +1703,46 @@ by reducing OkLCh Chroma, yields
 The OkLCh chroma has dropped from 0.251 to 0.117.
 </div>
 
+<h3 id="relative-alpha">Relative Alpha Colors</h3>
+
+The grammar of the ''alpha()'' function is as follows:
+
+<pre class='prod'>
+<dfn>alpha()</dfn> = alpha([from <<color>>]
+					[ / [<<alpha-value>> | none] ]? )
+</pre>
+
+
+Within a [=relative color=] syntax ''alpha()'' function,
+the allowed [=component keywords=] are:
+
+* <dfn value for="alpha()">alpha</dfn> is a <<number>> that corresponds to the
+	[=origin color's=] alpha transparency. 1.0 is equivalent to 100%.
+
+The color components of the [=origin color=] are unchanged,
+the alpha component is modified or replaced.
+The result of this function is in the color space of the origin color.
+
+<div class="example" id="ex-alpha-replace">
+	For example, here the result is the same as the origin color,
+	but the alpha is changed to 80%
+
+	<pre  highlight=css>
+	--mycolor: <span class="swatch" style="--color: rgb(71.122% 22.105% 89.033% / 0.3)"></span> oklch(60% 0.25 315 / 0.3);
+	<span class="swatch" style="--color: rgb(71.122% 22.105% 89.033% / 0.8)"></span> alpha(from var(--mycolor) / 80%);
+</pre>
+</div>
+
+<div class="example" id="ex-alpha-change">
+	For example, here the result is the same as the origin color,
+	but the alpha is modified to be half of that in the origin color
+
+	<pre  highlight=css>
+	--mycolor: <span class="swatch" style="--color: rgb(71.122% 22.105% 89.033% / 0.8)"></span> oklch(60% 0.25 315 / 0.8);
+	<span class="swatch" style="--color: rgb(71.122% 22.105% 89.033% / 0.4)"></span> alpha(from var(--mycolor) / calc(alpha * 0.5));
+</pre>
+</div>
+
 <!--
  ██████   ███████  ██        ███████  ████████     ███   ███
 ██    ██ ██     ██ ██       ██     ██ ██     ██   ██       ██