Transparent noise border

Shader code
shader_type canvas_item;

uniform sampler2D textureNoise: repeat_enable;
uniform float radius: hint_range(0.0, 1.0) = 0.459;
uniform float effectControl: hint_range(0.0, 1.0) = 0.309;
uniform float burnSpeed: hint_range(0.0, 1.0) = 0.076;
uniform float shape: hint_range(0.0, 1.0) = 1.0;

void fragment() {
    vec2 centerDistVec = vec2(0.5) - UV;
    
	float distToCircleEdge = length(centerDistVec) * radius;
	float distToSquareEdge = 0.5*(0.5 - min(min(UV.x, 1.0 - UV.x), min(UV.y, 1.0 - UV.y)));
	float distToEdge = mix(distToCircleEdge,distToSquareEdge,shape);

    float gradient = smoothstep(0.5, 0.5 - radius, distToEdge);

    vec2 direction = vec2(0, 1) * burnSpeed;
    float noiseValue = texture(textureNoise, UV + direction * TIME).r;

    float opacity = step(radius, mix(gradient, noiseValue, effectControl) - distToEdge);

    COLOR = texture(TEXTURE, UV) * vec4(1.0, 1.0, 1.0, opacity);
}
Tags
2d, border, burn, flames, ui
The shader code and all code snippets in this post are under CC0 license and can be used freely without the author's permission. Images and videos, and assets depicted in those, do not fall under this license. For more info, see our License terms.

Related shaders

Diagonal Mask / Border / Edge

Hex Mask/Border/Outline

Flat Border / UI Box

Subscribe
Notify of
guest

2 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Ongsosr
Ongsosr
2 months ago

How would I use this to add color in the transparent area around my sprite?

ColorauGuiyino
2 months ago
Reply to  Ongsosr

you can do something like:

vec4 new_color = vec4(1.0, 0.0, 0.0, 0.5);
COLOR = mix(texture(TEXTURE, UV), new_color, 1.0 - opacity);