Simple Thin Outline

Works by using two diagonal copies of the texture, perfect for achieving a thin outline. However, this method is not suitable for creating thick outlines.

Works for Godot 4.3 (currently latest)

# Learn how to create 2D shaders like these

Want to master 2D shaders? Learn how to create stunning effects like these and more by gaining a deep understanding of the GDShader language in Godot:

https://godot2dshaders.com/

# Credits

Credits to the creator of this cool necromancer sprite!

Credits character  https://creativekind.itch.io

Shader code
shader_type canvas_item;

uniform vec3 outline_color: source_color;
uniform float progress: hint_range(0.0, 1.0);

void fragment() {
	vec4 line_negative = vec4(outline_color.rgb, texture(TEXTURE, UV - 0.002).a);
	vec4 line_positive = vec4(outline_color.rgb, texture(TEXTURE, UV + 0.002).a);
	vec4 outline = mix(line_negative, line_positive, line_positive);
	COLOR.rgba = mix(COLOR, outline, progress * (1.0 - COLOR.a));
}
Tags
2d outline shader, outline, Outline Shader, pixel art outline, simple outline
The shader code and all code snippets in this post are under MIT license and can be used freely. Images and videos, and assets depicted in those, do not fall under this license. For more info, see our License terms.

More from GodotShaderBoy

The simplest outline shader (canvas_item)

Simple medium thick outline

2D shader: Out of body ghost effect (Pixel Art)

Related shaders

Simple medium thick outline

2D Outline and Rainbow outline 2 in 1

Simple Clipping with Adjustable Softedge

Subscribe
Notify of
guest

0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments