White Borders Occur With SurfaceAppearance From Far Away

Hello everyone! I was trying to create leaves in blender. I applied a leaf texture I found on the Internet (it’s a png file). When I imported it into Roblox Studio, the transparent parts of the mesh became white. I can fix this by setting the transparency to 0.02, but this time a weird bug happens as you can see below in the video.

External Media

I can also use the SurfaceAppearence property, but this time white lines form at the edges of the mesh, as you can see below.

External Media

So, my question is, what’s the best way to import a mesh with transparent textures? Any help is appreciated! :slightly_smiling_face:

Edit: I don’t know why streamable links directly download the video, sorry about that.

4 Likes

It’s not a matter of how the mesh is imported but rather the texture itself. I once had the same issue with stylized leaves and the solution turned out to be blurring the texture a bit (used gaussian blur).

The old texture in question. I don’t use it anymore.
image

The blurred one. It should look somewhat like this.
solution

The mesh with the unblurred texture is to the left and the blurred one is to the right. As it turns out, the white border is gone.

I hope this helps.

2 Likes

Thanks for your reply! This actually worked! It still happens but it’s not noticeable. But it’s ok for me. Thanks a lot!

2 Likes

This behaviour can occur because of how roblox blend nearby pixels:
image
On this image, you can see 9 rainbow pixels (scaled a bit)
Roblox will blend 5 neighbor pixels together:
image
So, in rezult you will get smth like this:
image
Most bad thing about this system, is that it also blends color of transparent pixels, and pixels which don’t exist (ex on border of image, in this case it will use black color). Image editors, in most cases use either white or black color for fully transparent parts of image, and due to this you can notice this white/black outlines near transparent pixels. To fix this problem, try to flood fill all your transparent pixels with needed color, or draw near them manually color which you need. (So it will be transparent orange color, or transparent red, whatever you need)

4 Likes

Oh, now I understand why. Thanks for explaining it!

1 Like

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.