Can't get diffuse + gradient opacity texture to match Photoshop

I’ve tried both Standard and PBR materials unlit / emissiveColor white etc but no matter what I do I can’t seem to get Babylon and Photoshop to match when I apply an opacity gradient texture to a material with an opaque diffuse/albedo texture. I also set opacityTexture.getAlphaFromRGB = true and I am getting an opacity gradient but it always looks “muddy” and incorrect. See below.

babylonjs-opacity-texture

The strip in the middle is the gradient opacity texture.

Arghhhh! Why do I often seem to answer my own questions 5 minutes after I post?!

I was using a black but 100% transparent canvas i.e.scene.clearColor = new Color4(0, 0, 0, 0) but when I switch to a white transparent canvas i.e. scene.clearColor = new Color4(255, 255, 255, 0) then it no longer looks muddy.

Not sure if this is a bug or expected behaviour, but either way it might help others in future.

2 Likes

tbh, I love Mondays when questions are already answered :wink:

2 Likes

It is actually expected as you are blending with the background.

1 Like