3DFlip is a high-performance interactive book-style image carousel that creates realistic page-flip animations using true 3D transforms. Users can drag to flip pages smoothly with momentum, snapping, and perspective depth. Each page supports hover overlays with fully customizable text, gradients, and typography.
The component uses Framer’s ResponsiveImage upload control for fast loading, sharp rendering, and easy content management. It’s ideal for immersive storytelling, portfolios, product showcases, and editorial layouts where motion and depth enhance user engagement.
Realistic 3D page flip animation with perspective depth
Smooth drag interaction with inertia and snapping
Responsive image upload support
Front and back page pairing automatically
Hover overlay with gradient background
Customizable overlay title and description
Full typography control for overlay text
Adjustable page size, corner radius, and tilt
Optimized image preloading for smooth performance
Works on desktop and mobile layouts
Portfolio showcases
Editorial layouts and storytelling pages
Product presentations and lookbooks
Photography galleries
Landing pages with interactive visuals
Creative agency websites
Homepage hero sections
Case study presentations
Brand storytelling sections
Gallery pages
Marketing microsites
Interactive product previews
Add the component to your canvas
Upload images using the Images property
Arrange images in pairs for front and back pages
Adjust page width, height, radius, and perspective
Tune drag sensitivity using Follow and Snap Bias
Customize tilt angle and initial page peek
Configure overlay gradient colors and height
Set title and description fonts and colors
Modify border styling from the Border control
Preview and fine-tune interaction behavior