Outline Shader Fragmentation Issue

Hi! I am currently learning shader graphs, and I want to create an outline for a card.

This is my shader graph:

When I add the blue outline to the main texture of the card together

The outline became fragmented, which looks like this in game:

This is the main texture of the card:

Not sure if the fragmentation is due to the rough borders of the original texture of the card.

Is there a way to make the outline smoother? Thanks a lot!

add the results of your step node coming from the top texture instead of the texture itself to the final color. you can see the same noisy stuff in the texture nodes’ preview. it has to do with alpha.

1 Like

Thank you for the help!

I tried adding a step node after the main texture and it indeed fixes the outline problem

However, this causes all of the cards to go blank

I think this is caused by the step node removing all the drawing that is initially in the card, for example, when I use this gunner card sprite as the main texture, the step node removes the drawing of the card:

Are there any ways that I can create an outline when keeping the card’s drawing? Thanks a lot!

multiply the color output of your texture by the stepped alpha of the texture and put that in where i had you insert the step node. also, step isn’t the greatest for performance, so i’d maybe suggest using floor/ceil/round.

1 Like

Thanks it works!

I have some additional questions regarding the adding node. When I was adding the stepped blank card and the blue outline, it seemed that the white card fell on top of the blue outline, making it nearly invisible.

Is there a way that I can overlay the blu outline on top of the white card. Thanks

so basically, white is 1.0, and a screens’ color range get hard clamped to 0-1 (ignoring tone mapping.) so, instead of adding to the already highest possible value, you will want to multiply. anything multiplied by 1 returns itself as i’m sure you know.

on a second look, i’m realizing that you have edges that overlap past just the white, so for those your addition will still work, but you’ll have to do it before the multiplication and get the ceiling and multiply with that.

1 Like