Loading…
No reviews yet — be the first to review this product.
A media-frame grid where hovering a frame expands its row and column (the whole grid reflows smoothly) and tilts that single card in 3D toward the cursor with a glare. Bring your own clips/images. Framer Motion.
Dynamic Frame Layout is an interactive grid of media frames. Hovering a frame expands its row and column — the whole grid re-flows smoothly via framer-motion — while that single card tilts in 3D toward the cursor with a moving glare. Other cards stay flat. Each frame's media can be a video URL, image URL, or any React node; the built-in defaults are original animated gradient tiles (no third-party assets bundled), so it looks great before you add content. Configurable columns, gap and hover-expand amount. Self-contained CSS, accessible focus support, prefers-reduced-motion friendly. React 19 + TypeScript. Requires framer-motion. Original work for Assetzaar.
Requirements
So it renders exactly like the preview.
1. Install dependencies
npm install framer-motionUpdated Jun 30, 2026
Cancel anytime