# [csswg-drafts] [compositing-1][compositing-2]I am looking for a concrete example of the application of the simple alpha blending formula (#8211)

• From: Letocha Torgue Philippe via GitHub <sysbot+gh@w3.org>
• Date: Fri, 09 Dec 2022 12:42:38 +0000
• Message-ID: <issues.opened-1486696268-1670589757-sysbot+gh@w3.org>
```letochagone has just created a new issue for https://github.com/w3c/csswg-drafts:

== [compositing-1][compositing-2]I am looking for a concrete example of the application of the simple alpha blending formula ==

in the following example I cannot determine the color obtained from the formula
explained in the note at the end of the following chapter:
https://www.w3.org/TR/compositing-1/#blending

In the following example I will try to apply the formula from the link above to calculate the color obtained

```
<div style="width: 200px;height:200px;
background-color:rgb(0,0,0);">

<div style="width: 200px;height: 200px;
background-color: rgba(150,50,100,0.4);">

<div style="width:200px;height: 200px;
mix-blend-mode: difference;
background-color: rgba(100,200,60,0.7);">
</div>
</div>
</div>
```

**co = as x (1 - ab) x Cs + as x ab x B(Cb, Cs) + (1 - as) x ab x Cb**

as= 0.7
Cs= [100/255,  200/255, 60/255]
ab= 0.4
Cb=[150/255, 50/255, 100/255]

B = | Cb - Cs | = ( 50/255 , 150/255 , 40/255 )

co = as * (1 - ab) * Cs + as * ab * B + (1 - as) * ab * Cb
ao= as+ ab*(1-as)

co = [ 0.29 , 0.52,  0.19 ]
ao = 0.82

Co = co/ao
Co = 0.35 0.63 0.23

this color does not match the one read with a screenshot

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

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

Received on Friday, 9 December 2022 12:42:40 UTC