Repository navigation
[css-color-5] color-mix() algorithm requires division by zero #14013
Description
For the case of color-mix(in srgb, red 0%, blue 0%, green 100%), the color-mix() result calculation requires division by zero.
The issue happens in the first iteration of step 4.2.2 calculating (b’s percentage) / combined percentage). In the first iteration, a and b will be [red 0%] and [blue 0%], with a combined percentage of 0%.
My proposal would be to change the text of step 4.2.2, replacing:
"...with a progress percentage equal to (b’s percentage) / combined percentage)."
with
"with a progress percentage equal to (b’s percentage) / combined percentage) if combined percentage is greater than 0, and 0.5 otherwise."
(or something to that effect).
cc @svgeesus
Activity
[css-color-5] Guarded against division by zero in color-mix() algorithm
[Color] Update color-mix resolution for new 0% rules
yisibl commentedon Sep 2, 2026
@svgeesus @weinig I think the conclusion in Example 5(8195d37) needs to be revised; the description of
color-mix(in oklch, teal 0%, olive 0%)as resulting in “transparent black” is no longer correct.The WPT has been fixed in web-platform-tests/wpt@5942b88
[css-color-5][editorial] Fix sum-to-zero mix example, #14013
svgeesus commentedon Sep 2, 2026
@yisibl to guard against this sort of thing in future (and because I have wanted such a tool for a while) behold
color-mix()step by stepwhich has now validated all the examples in the spec (and found a couple of errors).
It computes ΔE between its own result and the browser result, too!
[CSS] Handle color-mix() and palette-mix() percentages adding up to zero
[CSS] Handle color-mix() and palette-mix() percentages adding up to zero
[CSS] Handle color-mix() and palette-mix() percentages adding up to zero
Bug 2070541 [wpt PR 62494] - [CSS] Handle color-mix() and palette-mix…
[CSS] Handle color-mix() and palette-mix() percentages adding up to zero
Bug 2070541 [wpt PR 62494] - [CSS] Handle color-mix() and palette-mix…