Check out this playground scene. When I change the clear color to white, the background’s alpha also increases, even though I set it to 0. Babylon.js Playground Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes @mrlooi @sebavan

[image] Transparent canvas background Questions This is because by default the canvas is in premultiplied alpha when using webgl. Just run the engine initialization like this: var engine = new BABYLON.Engine(canvas2, true, { premultipliedAlpha: false // Ask for non-pr…

maybe you should change the transparency of the canvas <canvas id="myCanvas" style="opacity: 0.5"></canvas>

I have updated the playground, you can see the different

I found out that the alpha channel is not handled in the material, too, and had to write a shader for! Babylon.js Playground Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes Just use “gl_FragColor = color;” in the shader and alpha is ha…

thy is probably related to alpha premultiplication on the canvas.

Currently, I have to hotfix using the following way: if gl_FragColor.a <= 0.001 { gl_FragColor.rgb = vec3(0.); }

this is expected as this is how the blending with the background of the canvas works.

How do I change the blending mode ?

Clear alpha is affected by color

Bugs

inteja July 13, 2024, 10:04am 11

Topic		Replies	Views
Transparent canvas background Questions	3	2577	September 23, 2019
When the scene clearColor is transparent, overlapping with other elements causes color blending Questions	7	106	June 12, 2024
Issue with Postprocess and alpha Questions shader , mobile , postprocessing , alpha	15	227	March 9, 2024
What determines the color when the material alpha=0 and the transparency mode is opaque？ Questions	2	268	August 17, 2023
Clear color transparency causes color to disappear entirely in some circumstances Bugs scene , transparency	7	706	December 27, 2022

Clear alpha is affected by color

Related topics