Distortion Grid

Show Preview
Distortion Grid

About Distortion Grid

Distortion Grid brings physics-inspired interactivity to static image layouts. Using inline SVG displacement maps — feTurbulence + feDisplacementMap — each image in the grid reacts to how close your cursor is, creating a magnetic bulge effect that makes the whole grid feel alive.

What you can customize

  • Image: local upload or URL import

  • Columns: number of columns on each breakpoint

  • Gap and border radius probs

  • Distortion intensity

  • Pop-up modal

Use cases

  • Portfolio or agency hero sections

  • Editorial image galleries

  • Product showcase grids

  • Interactive mood boards