glslify module for fast approximation of chromatic aberration as a post processing (fullscreen) effect.
The function shifts each RGB channel separately in the given direction.
Combine with a directional blur pass for more convincing results.
glslify is required for importing.
yarn add glsl-chromatic-aberration
npm i glsl-chromatic-aberration --save
vec4 ca( sampler2D image, vec2 uv, vec2 resolution, vec2 direction )The function shifts each RGB channel of image separately in the given direction and returns the color for the pixel at uv.
#pragma glslify: ca = require('glsl-chromatic-aberration')
uniform vec2 iResolution;
uniform sampler2D iChannel0;
void main() {
vec2 uv = gl_FragCoord.xy / iResolution;
vec2 direction = ( uv - .5 ) * 10.0;
gl_FragColor = ca( iChannel0, uv, iResolution.xy, direction );
}