This component brings your content to life with a clean swapping card animation. Cards transition smoothly with subtle 3D rotation and motion, creating an engaging visual experience without affecting performance.
Built entirely using Framer properties, you can easily control layout, animation, styling, and behavior directly from the right-side panel no coding required.
Whether you're building a portfolio, landing page, or product showcase, this component helps you present information in a modern and interactive way.Key Features
Smooth card swapping animation
Subtle 3D rotation effect for depth
Fully customizable via Framer properties panel
Adjustable card size, spacing, and layout
Image support with cover/fit options
Custom background, gradients, and colors
Border radius and styling controls
Responsive across all screen sizes
Lightweight and performance-friendly
Customization Options (Important for Buyers)
All controls are available in the right-side panel:
Scroll height control
Card width & minimum width
Image height & fit (cover/contain)
Animation values (rotate, position, exit animation)
Background color & gradient toggle
Border radius control
Header gradient colors
Card padding & spacing
Typography settings (font, size, spacing)
Use Cases
Service or feature sections
Portfolio showcases
Product highlights
Case studies
Team or testimonial sections
Interactive landing pages
Why This Component
Most card components feel static. This one adds motion in a controlled and professional way enough to grab attention without feeling distracting.
It’s especially useful if you want:
A premium UI feel
Better user engagement
Clean animations without complexity
How to Use
Add the component to your page
Replace images and text content
Adjust styling and animation from the right panel
Done - no code required
Nirav Jivani
