The Flip Card flips on hover based on the side where the cursor enters, with customizable corner radius, flip duration, and easing.
Made with Workshop
Build your own component with AI
The Flip Card is an interactive image component that flips smoothly when hovered. The animation direction depends on the side where the cursor enters, creating a natural and engaging effect. It’s perfect for image galleries, portfolios, or any layout where you want to reveal content in a playful but polished way.
Flips on hover based on the side of cursor entry
Smooth, animations
Backside image revealed
Front and back images
Corner radius
Flip duration
Flip easing
When the cursor enters the card, the component detects the entry side and rotates along the corresponding axis. The motion uses smooth transforms and easing, resulting in a responsive and consistent interaction.