[fxtf-drafts] [compositing] blending calculations (#471)

letochagone has just created a new issue for https://github.com/w3c/fxtf-drafts:

== [compositing] blending calculations ==
in order to implement some CSS functions in WebGL, I am trying to understand precisely their implementations.
Currently my problem concerns the mix-blend-mode:

in order to implement some CSS functions in WebGL, I am trying to understand precisely their implementations


currently my problem concerns the mix-blend-mode:

here is an example, the color obtained almost corresponds to the theory except for the G value.
As my calculated G value exceeds 1 maybe the problem comes from there.

```
<div 
  style="
  width: 150px;
  height: 150px;
  background-color: rgba(255, 0, 0, 0.4);">
  <div
    style="
    width: 100px;
    height: 100px;
    mix-blend-mode: difference;
    background-color:rgba(0,255,0,0.7);" >
  </div>
</div>
```
I apply the theory explained here:
[https://drafts.fxtf.org/compositing/#blending](https://drafts.fxtf.org/compositing/#blending)

Cb = ( 1 , 0 , 0 )  ab = 0.4
Cs = (0 , 1 , 0 )   as =0.7
Cm = | Cb - Cs | = ( 1 , 1 , 0 )

Cr = ( 1 - ab ) * Cs + ab * B(Cb,Cs)
Cr = ( 1 - ab ) * Cs + ab * Cm
Cr = ( 1 - ab ) * Cs + ab *  ( 1 , 1 , 0 )
Cr = ( 1 - 0.4 ) * ( 0 , 1 , 0 ) + 0.4 * ( 1 , 1 , 0 )
**Cr = ( 0.4 , 1 , 0)**
ao = as + ab * ( 1- as)
ao = 0.7 + 0.4 * ( 1 - 0.7) = 0.82


here is the color obtained after applying the mix-blend-mode
rgb = (0.4 , 1 , 0)
alpha= 0.82

now I compose this color with the color of the html page (white color)

(0.4 , 1 , 0) + ( 1 , 1 , 1 ) * ( 1 - 0.82 )
= ( 0.58 ,  1.18 ,  0.180)
= ( 0.58 , 1 , 0.18 )

 however, the color obtained differs in green:

![image](https://user-images.githubusercontent.com/7129968/197055336-ce33cb00-941d-4d35-a7f6-36b79aeadee3.png)

148/255 = 0.58
**225/255 = 0.88**
48/255 = 0.188

Why ? thank you for your explanations



Please view or discuss this issue at https://github.com/w3c/fxtf-drafts/issues/471 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Thursday, 20 October 2022 20:56:23 UTC