Ripples

Ripples

Free

Free

Ripple animation replicates concentric wave-like motions, signaling interaction or touch feedback in interfaces and designs.

Caution : *May break if you copy another three.js component with three version other than r136*

How to use:


  1. Copy the Link.

  2. Paste the copied link onto the Framer Canvas area.

  3. The Ripple component will now be visible on the Canvas.

  4. Customization Options on the Right Sidebar: On the right sidebar, explore customization options for the Ripple component:

    1. Import your image into the designated Image property field.

    2. Adjust the scale to determine the size of the ripple effect

    3. Define the length of the ripple path by setting the Steps property accordingly.