WaveRippleGrid

WaveRippleGrid

About WaveRippleGrid

About

WaveRippleGrid brings a sense of fluid motion to your Framer projects by turning standard image layouts into interactive, waving grids. It’s designed for creators who want to move beyond static galleries, allowing visuals to feel alive and responsive as users scroll or move their mouse across the screen.

What it does

The component organizes your images into a clean grid that gently ripples with a customizable wave animation. It includes a built-in 3D tilt effect that follows the cursor to add depth, and a ticker mode that creates a seamless, infinite horizontal scroll. Whether you need a subtle background or a high-energy hero section, it handles the math and physics of the motion automatically.

What you can customize

  • Grid & Motion: Control the number of rows and columns, adjust cell sizes, and fine-tune the wave’s speed, frequency, and amplitude for the perfect rhythm.

  • 3D Effects: Toggle the tilt effect on or off, adjust the tilt intensity, and set the perspective to give your grid a unique sense of space.

  • Visual Styling: Customize the border radius, background colors, and spacing (Gaps) to match your site’s aesthetic.

  • Ticker Mode: Enable a smooth auto-scrolling ticker, with full control over the scroll speed and the gap between repeating items.

Great for

  • High-end hero sections and landing pages

  • Creative portfolio galleries and photography showcases

  • Brand logo walls or sponsor tickers

  • Visual-heavy "Work" or "About" pages

  • Adding interactive "eye-candy" to any layout

Share your build

If you ship something cool with it, post it on X and tag me @Dulajweb,

Need help?

Questions or feedback? Reach me anytime: dulajdilshan766@gmail.com or on X @Dulajweb