Depth Stack Gallery is a premium interactive gallery component that creates a cinematic, depth-based browsing experience for images and videos. Items stack in 3D space, react naturally to cursor movement, and expand smoothly on click while keeping performance optimized.
The component intelligently handles both images and videos, supports hover-based or autoplay video playback, pauses media when off-screen, and includes a built-in preloader for a polished experience. Every visual detail—from spacing and size to borders and shadows—is fully customizable through Framer controls.
Designed for modern portfolios, product showcases, and storytelling layouts, this gallery adds depth and motion without sacrificing usability or performance.
3D depth-stacked card layout with perspective effects
Supports both images and videos in a single gallery
Hover-based or autoplay video playback
Smart video handling (pause when off-screen, reset on hover out)
Click to expand cards with smooth centering animation
Scroll-based parallax movement for added depth
Built-in media preloader with loading state
Fully responsive across desktop, tablet, and mobile
Keyboard and accessibility considerations (Escape to close)
Optimized performance using viewport detection
Portfolio galleries
Product showcases
Creative agency websites
Landing pages with visual storytelling
Media-rich brand presentations
Photography or video collections
Designers who want a premium interactive gallery
Creators showcasing mixed media (images + videos)
Websites that need depth and motion without heavy animation libraries
High-end portfolios and hero sections
Add images using the Images array control
Add videos via upload or URL in the Videos section
Set the maximum number of visible items with Max Items
Adjust spacing using Card Gap
Control card size with Card Width and Card Height
Customize expanded view using Expanded Width
Toggle video autoplay or hover-only playback
Style corners with Card Radius
Configure borders and shadows separately for normal and expanded states
Match the gallery to your layout using Background Color
Frame Craft
