Qi aura, outline

Enable texure mipmaps:

Texture file > Import > Generate Mipmaps

Enable any mipmaps filter:

CanvasItem > Filter > LinearMipmaps

In pixel art it looks weird.

Hi, this is a “simple” shader (I mean, I can only change colors :V), after hours of typing, plus about 2 tutorials (there aren’t many, or I don’t know how to search :V) I got this.

I hope you like it and enjoy it.

Shader code
shader_type canvas_item;
render_mode unshaded, blend_mix;

uniform vec2 ScaleMult = vec2(1.0);

uniform float AuraProgres :hint_range(0.0, 1.0, 0.1) = 0.0;
uniform float TextureLaodMult :hint_range(0.0, 10.0, 0.01) = 8.0;
uniform float Tilling :hint_range(0.0, 60.0, 0.01) = 26.0;
uniform vec2 MovementDirSpeed = vec2(-0.6, 1.0);
uniform vec2 MovementDirSpeed2 = vec2(0.6, 1.0);
uniform sampler2D color_gradiant :repeat_enable, filter_linear_mipmap;
uniform vec2 Noise_Seed = vec2(1.0);

vec2 random(vec2 uv){
	uv += Noise_Seed;
	uv = vec2( dot(uv, vec2(127.1,311.7) ),
		dot(uv, vec2(269.5,183.3) ) );
	return -1.0 + 2.0 * fract(sin(uv) * 43758.5453123);
	}
float noise(vec2 uv) {
    vec2 uv_index = floor(uv);
    vec2 uv_fract = fract(uv);
    vec2 blur = smoothstep(0.0, 1.0, uv_fract);
    float bottom_left = dot(random(uv_index + vec2(0.0, 0.0)), uv_fract - vec2(0.0, 0.0));
    float bottom_right = dot(random(uv_index + vec2(1.0, 0.0)), uv_fract - vec2(1.0, 0.0));
    float top_left = dot(random(uv_index + vec2(0.0, 1.0)), uv_fract - vec2(0.0, 1.0));
    float top_right = dot(random(uv_index + vec2(1.0, 1.0)), uv_fract - vec2(1.0, 1.0));
    float bottom_mix = mix(bottom_left, bottom_right, blur.x);
    float top_mix = mix(top_left, top_right, blur.x);
    float final_value = mix(bottom_mix, top_mix, blur.y);
    // Ajustamos para que el resultado esté en el rango de 0.0 a 1.0
    return (final_value + 1.0) * 0.5;
}
vec4 AuraEffect(vec2 uv, vec4 CurrentColor, sampler2D OriginTexTure){
	vec2 TimeUV = MovementDirSpeed * TIME;//direction
	vec2 TimeUV2 = MovementDirSpeed2 * TIME;//direction
	vec2 ScaleMultFractment = (1.0 - ScaleMult)/2.0;//Scale the outline
	vec2 compos_uv = uv * ScaleMult + ScaleMultFractment; //Scale the outline
	//I don't know about shaders but I got this, this was the key.----> noise(uv * Tilling + TimeUV) * 8.0
	vec4 alpha = textureLod(OriginTexTure, compos_uv, noise(uv * Tilling + TimeUV) * TextureLaodMult);
	vec4 GradientColors = texture(color_gradiant, fract( vec2(-uv.y, uv.x) + (TimeUV * 0.4)) ) * 3.0;
	vec4 sil = GradientColors * noise(uv * Tilling - TimeUV);
	sil.a = alpha.a * noise(uv * Tilling + TimeUV) * noise(uv * Tilling + TimeUV2) * 5.0;
	//return sil;
	return mix(CurrentColor, sil * AuraProgres,  (1.0 - CurrentColor.a));
}

void fragment() {
	// Called for every pixel the material is visible on.
	COLOR = AuraEffect(UV, COLOR, TEXTURE);
}

//void light() {
	// Called for every pixel for every light affecting the CanvasItem.
	// Uncomment to replace the default light processing function with this one.
//}
Tags
Aura, Dragon, outline, shadow
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

Pulse Aura for 3D Character

2D Outline and Rainbow outline 2 in 1

2D Pixel Shadow/Outline

Subscribe
Notify of
guest

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

How to set Color Gardient to achieve the effect in the picture? thanks

zhaodongchen1987
zhaodongchen1987
2 months ago
Reply to  JInDaifer

Useful, very cool!

aicool
2 months ago

not valid

aicool
2 months ago
Reply to  JInDaifer

Thank you for your work. I still can’t get my head around it though
Can you come up with a video demonstration

drdeus
drdeus
2 months ago

For me this shader doesn’t look like your screenshot at all, the edges are just a sharp outline that follow the exact shape of the texture the shader is on