Texture filtering adds weird smudge around transparent elements

Hey there (did the forum change recently? I was having trouble getting around, it looks very weird and confusing :smiley: )

Anyway,
I’m trying to implement some color tinting to have themes in a UI (in 4.15) so for that I needed to make the colored elements all white while leaving the background untouched.

However even though I somehow managed to separate all the background in PS so I can layer them back together in UMG, I am getting a very ugly smudge around the edges of things… so I investigated a bit and it turns out texture filtering is doing that when importing the asset.
If I set it to “Nearest” then all of the blurriness and smudges are gone… however when the interface isn’t the exact size in PIE… basically my circle looks like a hexagon…

Is there some way to make this work better?

Here’s a picture of what I’m talking about, the bottom one is the old single picture colored one, the top one is with separate background and foreground and you can see all of those smudges around the edge.

Hmm… maybe if I make them bigger the smudges will be less noticeable and scaling down won’t hurt it too much either…
I’m not an artist, I can barely operate the darn photoshop lol… I typically make small icons and such one size larger than I need it (in this case I need 32x32 so I made a 64x64 icon), but maybe increasing the size will somehow mitigate the effect and not look too horrible…

Edit: nope, that just made it worse :slight_smile:

Okay, I ended up with a compromise…
I’m recoloring only the outside border of those buttons and picked a neutral yellow-ish tint for the + - in the middle and added that to the gray background, this way the effect is localized only to the edges and it isn’t noticeable ingame.

image

image

1 Like