Chromatic Abberation (With Offset)

 Properties work as :

  • Strength is the strength of the effect (max in white) .
  • Black in the Offset Image represents 0 effect of chromatic abberation while white does max.
  • No Offset Image will act like full white image.

My favorite method is : 
– Canvas Layer
–Control ( FULL_RECT )
—Color Rect ( FULL_RECT , color : white , with the shader)

One example of offset texture is provided .

Shader code
shader_type canvas_item;

uniform sampler2D offset_image : hint_white;
uniform float strength = 1.0;

void fragment() {
	vec4 output = texture(SCREEN_TEXTURE, SCREEN_UV);
	
	float shift = strength * texture(offset_image, SCREEN_UV).r / 100.0;
	output.r = texture(SCREEN_TEXTURE, vec2(SCREEN_UV.x + shift, SCREEN_UV.y)).r;
	output.g = texture(SCREEN_TEXTURE, SCREEN_UV).g;
	output.b = texture(SCREEN_TEXTURE, vec2(SCREEN_UV.x - shift, SCREEN_UV.y)).b;
	
	COLOR = output;
}
Tags
abberation, chromatic, chromatic abberation, screen, Screen shader
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

Chromatic Abberation

rgb offset shader v2

Noise Offset (Wiggle)

Subscribe
Notify of
guest

1 Comment
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
zuwiwano
8 months ago

For Godot4:

shader_type canvas_item;

uniform sampler2D offset_image : hint_default_white;
uniform float strength = 1.0;
uniform sampler2D SCREEN_TEXTURE:hint_screen_texture, filter_linear_mipmap;

void fragment() {
	vec4 output = texture(SCREEN_TEXTURE, SCREEN_UV);
	
	float shift = strength * texture(offset_image, SCREEN_UV).r / 100.0;
	output.r = texture(SCREEN_TEXTURE, vec2(SCREEN_UV.x + shift, SCREEN_UV.y)).r;
	output.g = texture(SCREEN_TEXTURE, SCREEN_UV).g;
	output.b = texture(SCREEN_TEXTURE, vec2(SCREEN_UV.x - shift, SCREEN_UV.y)).b;
	
	COLOR = output;
}