Skip to content

Interactions Pack

Interactions to make your UI alive

Interactions Pack preview image 1

Summary

Card Interactions Pack is a single drag-and-drop Framer component with four distinct, production-ready interactions.

Description

Card Interactions Pack is a single drag-and-drop Framer component with four distinct, production-ready interactions. Pick a variant, customize, and drop it into any card layout. No extra setup required.

Recursive Circles

Hover over the circle and it splits into four. Each child splits again on hover, up to 8 levels deep. Spring-animated, satisfying, and oddly hard to stop hovering.

Block Grid

A dense grid of cells that disappear on hover and slowly fade back in. Tune the grid density, fade delay, and fade speed to match your design system.

Trail Squares

Move your cursor across the card to paint a trail of layered squares. Double-click anywhere to reset back to the default X pattern.

Ripple Rects

A grid of rectangles that tilt toward your cursor within a defined radius, then snap back smoothly when you leave.

Every variant includes:

Full customization control for elements

Responsive — adapts to any card size automatically

Smooth, performant animations with no dependencies

Configurable via Framer property controls — no code needed

Rank history How rankings work →

125015001750181938/149/49/2610/1811/9
  • All · #8193

Details

More like this