Chromatic Chaos Distortion
Need to express the chaos ? Here’s a chromatic abberation distortion shader.
Parameters are:
- chaos : Maximum number of pixels for displacement.
- radius : Distortion range around the center of the effect.
- attenuation : Easing exponent for distortion mixing (3 = Cubic Out, 4 = Quart Out, 5 = Quint Out)
Apply this shader to a ColorRect for example, make sure the layer is on top of what you want to distort.
Shader code
shader_type canvas_item;
uniform float chaos : hint_range(0., 32.) = 1.;
uniform float radius : hint_range(0., 1.) = 0.5;
uniform float attenuation : hint_range(1., 5.) = 2.;
varying vec2 amount_r;
varying vec2 amount_g;
varying vec2 amount_b;
float rand(vec2 co){
return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453) - .5;
}
void vertex() {
vec2 shifted_uv = (UV * 2.) - 1.;
amount_r = normalize(
vec2(rand(TIME * 1.3 * shifted_uv),
rand(TIME * 1.64 * shifted_uv)));
amount_g = normalize(
vec2(rand(TIME * 1.5 * shifted_uv),
rand(TIME * 1.7 * shifted_uv)));
amount_b = normalize(
vec2(rand(TIME * 1.17 * shifted_uv),
rand(TIME * 1.23 * shifted_uv)));
}
void fragment() {
vec2 chaos_v = vec2(chaos, -chaos) * SCREEN_PIXEL_SIZE;
float dist = length((UV - vec2(0.5)) * 2.);
float att = clamp(dist / radius, 0., 1.);
chaos_v *= 1. - pow(att, attenuation);
COLOR = vec4(
texture(SCREEN_TEXTURE, SCREEN_UV + chaos_v * amount_r).r,
texture(SCREEN_TEXTURE, SCREEN_UV + chaos_v * amount_g).g,
texture(SCREEN_TEXTURE, SCREEN_UV + chaos_v * amount_b).b,
1.);
}Live Preview
//shader by CasualGarageCoder, updated to Godot 4 shader_type canvas_item; uniform sampler2D SCREEN_TEXTURE : hint_screen_texture, filter_linear_mipmap; uniform float chaos : hint_range(0., 32.) = 1.; uniform float radius : hint_range(0., 1.) = 0.5; uniform float attenuation : hint_range(1., 5.) = 2.; varying vec2 amount_r; varying vec2 amount_g; varying vec2 amount_b; float rand(vec2 co){ return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453) - .5; } void vertex() { vec2 shifted_uv = (UV * 2.) - 1.; amount_r = normalize( vec2(rand(TIME * 1.3 * shifted_uv), rand(TIME * 1.64 * shifted_uv))); amount_g = normalize( vec2(rand(TIME * 1.5 * shifted_uv), rand(TIME * 1.7 * shifted_uv))); amount_b = normalize( vec2(rand(TIME * 1.17 * shifted_uv), rand(TIME * 1.23 * shifted_uv))); } void fragment() { vec2 chaos_v = vec2(chaos, -chaos) * SCREEN_PIXEL_SIZE; float dist = length((UV - vec2(0.5)) * 2.); float att = clamp(dist / radius, 0., 1.); chaos_v *= 1. - pow(att, attenuation); COLOR = vec4( texture(SCREEN_TEXTURE, SCREEN_UV + chaos_v * amount_r).r, texture(SCREEN_TEXTURE, SCREEN_UV + chaos_v * amount_g).g, texture(SCREEN_TEXTURE, SCREEN_UV + chaos_v * amount_b).b, 1.); }ohohohoHOHOH this shader is PERFECT for my game
I don’t know why, maybe some jank visibility ordering on my end, but sometimes this shader makes the character I’m using it on display the background behind them.
I’m not complaining, as the character is meant to be a soft-time limit horror monster that makes terrible beeping noises as it chases the player down, randomly moving walls around and shredding anything in its way. I don’t know why the visual bug happens but it’s kinda perfect~
I had the exact same problem, haven’t managed to figure out why it happens in some scenes and not others but when it does I managed to solve it by putting a BackBufferCopy node right above the shader and setting its Copy Mode to Viewport!