Image Warping with RGB channel displacement : On Hover

How do you achieve an effect similar to this:

When hovering on the image, it is distorted and RGB channels are also displaced.

You apply the distortion function 3 times, once for R , G and B, with slightly different strengths… You read the 3 texture samples and take the .r , .g, and .b from each respectively and combine into the final color.

The effect is called “chromatic aberration” and simulates the fact that different lense/glass types, refract red/green/blue lights at slightly different angles based on the wavelength of the light.