Stylised squares fade 2D

Shader code
shader_type canvas_item;
render_mode blend_mix;

uniform float fade : hint_range( 0.0, 1.0, 0.01 ) = 0.0;
uniform float tiling : hint_range(0.0, 100.0, 1.0) = 10.0;

float get_grid( vec2 uv )
{
	uv = abs( uv );
	return float( int( uv.x * 100.0 ) % int( ( 1.0 - pow( fade, 2 ) ) * 100. ) ) * float( int( uv.y * 100.0 ) % int( ( 1.0 - pow( fade, 2 ) ) * 100. ) );
}

float get_line( float uv )
{
	uv = mod( uv * tiling, 1.0 );
	return round( ( min( uv, 1.0 - uv ) / ( fade )) );
}

void fragment()
{
	COLOR.a = COLOR.a * ( get_line( UV.x ) * get_line( UV.y ) );
}
Tags
2d, fade, retro, square, transition
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 MehdiTheLord

Retro Fade 2D

Related shaders

Slice and Fade out

Fade by distance to character

Animated Fade Shader with Additional Effects

Subscribe
Notify of
guest

1 Comment
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
HazL
HazL
4 days ago

Hi,
How to use this animation, you need to tween, the fade property ?
Thnaks