+7

Electric arc effect

Create a Node2D, and add a Sprite as child. For the sprite texture, choose “New Noise Texture” and for the noise choose OpenSimplexNoise. For the material, choose ShaderMaterial -> Shader and add the code below.

The size of the sprite will be the same size as the texture you made.

To change the orientation of the electric effect, rotate the Node2d parent.

You can choose the line width, color and border color of the effect. Line width likely needs to be very small, around 0.01 or less.

Effect looks better animated.

 

Shader code
shader_type canvas_item;
render_mode unshaded;

uniform float line_width;
uniform vec4 color : hint_color;
uniform vec4 border_color : hint_color;

void fragment() {
	float variance = UV.y;
	if(variance > 0.5) {
		variance = 1.0 - variance;
	}
	variance = variance * 3.0;
	float weight = texture(TEXTURE, UV + TIME).r;
	float xpos = UV.x + ((((weight / 2.0) - 0.25)) * variance);
	if(xpos > 0.5) {
		xpos = 1.0 - xpos;
	}
	if(xpos > (0.5 - line_width)) {
		COLOR = color;
	}
	else {
		if(xpos > (0.5 - (line_width * 2.0))) {
			// convert the distance
			float alpha = (xpos - (0.5 - (line_width * 2.0))) / line_width;
			alpha = 1.0 - alpha;
			if(alpha < 0.5) {
				alpha = 0.0;
			}
			COLOR = border_color;
			COLOR.a = alpha;
		}
		else {
			COLOR = vec4(0, 0, 0, 0);	
		}
	}
}
Tags
Electric
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

2D mirror effect

Teleport effect

VHS and CRT monitor effect

guest
1 Comment
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Coder1965
Coder1965
1 month ago

Acts nicely as a barrier in my arcade platformer, looked great once remembered to set the width -)