Issues with transparent materials and transparent canvas

I ran into an issue where the transparent material didn’t render as expected with a transparent canvas.

This is because the default blend type (Alpha), uses the colour of the background of the DOM as seen in the GIF below:

Kapture 2021-07-26 at 10.56.04

This can be a problem if the app is used within a different framework/site on the final product.

This can be avoided by having the DOM colour set to black or using ‘Premultiplied Alpha’ as the blend type.

1 Like