Dual Face Card

About this Component

Flip3D is a versatile and interactive card component designed for creators who want dynamic, two-sided content without writing any code. Perfect for portfolios, product showcases, or engaging UI sections.

✨ Features:

• Choose flip interaction: Hover or Click

• Optional Invert Flip for reverse animation

• Smooth built-in animation powered by Framer Motion

• Fully customizable content for both sides

• Supports X-axis or Y-axis rotation

🛠 How to Use:

1. Connection

• Prepare front and back sides as Frames/Images/stacks.

• Import the Flip3D component into your Framer project.

• Connect the front and Back sides.

• Edit Properties to your needs.

2. Set Interaction

• Select the card on the canvas.

• From the right-side property panel, choose Flip On Hover or Flip On Click.

• Optionally, toggle Invert Flip to reverse the rotation direction.

• Choose the rotation Axis (X or Y) and customize the transition for smooth animation.

And that’s it! Your card now flips beautifully with full control over interaction and animation.

This component is perfect for:

• Portfolios & personal showcases

• Product or feature highlights

• Testimonials or case studies

• Any section that benefits from a touch of interactivity and surprise