Simple Highlight Effect

Uses an SDF provided by a LightOccluder2D object to create a highlight effect

Shader code
shader_type canvas_item;
render_mode world_vertex_coords;

uniform float outline_width;
uniform vec2 lower_limit;
uniform vec2 upper_limit;

uniform vec4 color : source_color;

void vertex() {
	vec2 disp;
	
	// resizes the 
	switch (VERTEX_ID)
	{
		case 0:
			disp = vec2(lower_limit.x, lower_limit.y);
			break;
		case 1:
			disp = vec2(lower_limit.x, upper_limit.y);
			break;
		case 2:
			disp = vec2(upper_limit.x, upper_limit.y);
			break;
		case 3:
			disp = vec2(upper_limit.x, lower_limit.y);
			break;
	}
	
	VERTEX = disp;
}

void fragment() {
	float alpha;
	
	// use sdf to calculate the alpha of the highlight
	alpha = 1.0 - texture_sdf(screen_uv_to_sdf(SCREEN_UV)) / float(outline_width);
	COLOR = color;
	COLOR.a = alpha;
}
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

Simple 2D Highlight

2D Highlight Effect

Highlight Effect

Subscribe
Notify of
guest

1 Comment
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
PBFgames
PBFgames
30 days ago

My god, I can’t get this to work. I’ve tried much and brushed up on shaders again by reading and watching videos the last few days. At best, I can get a fully colored rect over where my sprite is in the editor. It does not appear when run, And if it did, It still would not be an outline but rather a fully colored rectangle over the sprite.

This is obviously user error ( me ) , But I thought I’d comment for some help or at least to warn others it MAY be tricky.

Regardless, Thanks for making the shader

Godot 4.3 Stable