multi step ui image shader question

Hi - I’m needing to do this to a UI image , and thought I’d look into doing it with a shader as my original method was too slow. So it needs to

make the white transparent.
stroke the black with a white edge.
remove the black
crop inside a circle

Is this something I would be able to do in shader graph or am I going to need to write this myself ? any tips on how to go about this ? cheers !

You’re looking for an edge detection shader. A common one would be a Sobel filter, but the main idea is to sample the base texture multiple times with slight offsets and compare the samples. If two or more samples don’t match, you have an edge. Output the result as the alpha.

Here’s a simple 4 sample edge detection shader.

1 Like