Search code examples
htmlimageoverlaytransparencyaframe

Aframe Image transparency

I'm new to A-frame I would like to add images with transparency (.png) into the scene. Apparently they cannot be overlay. I use

    <a-image position="0 0 -20" material="transparent: true" width="32" height="19" src="#img1"></a-image>

And I got a square background color-like.

The green image looks cut-cropped

Solution

  • The renderer won't find out properly which image is in front of another without the material's alpha-test:0.5 property set.

    Here is an example with and without the alpha-test