File tree Expand file tree Collapse file tree 1 file changed +10
-0
lines changed Expand file tree Collapse file tree 1 file changed +10
-0
lines changed Original file line number Diff line number Diff line change @@ -126,9 +126,19 @@ Mixing colors: the ''color-mix()'' function {#color-mix}
126
126
127
127
If a percentage is omitted, it defaults to 50% (an equal mix of the two colors).
128
128
129
+ The result is produced via the following algorithm:
130
+
131
+ 1. If a percentage is omitted, it defaults to 50% (an equal mix of the two colors).
132
+ 2. Both colors are converted to the specified [=colorspace=] .
129
133
If the specified colorspace has a smaller gamut
130
134
than the one in which the color to be adjusted is specified,
131
135
gamut mapping will occur.
136
+ 3. Colors are then <a href="../css-color-4/#interpolation">interpolated in the specified colorspace</a> .
137
+ The result of mixing is the color at the specified percentage along the progression.
138
+
139
+ Note: As a corrollary, 0% just returns the first color converted to the specified colorspace,
140
+ 100% returns the second color converted to the specified colorspace,
141
+ and 50% produces an equal mix of both.
132
142
133
143
<div class="example">
134
144
This example produces a mixture of 40% <span class="swatch" style="--color: peru"></span> peru
You can’t perform that action at this time.
0 commit comments