3D Card Flip

AnimationsLive Preview

Card flips to reveal a back side with a smooth 3D rotation.

Customize Preview

Select options to update the live preview, or edit the prompt directly below.

Flip Axis

Front Content

Back Content

Trigger

Your Prompt

abcclick to edit

Create a 3D card flip component that rotates horizontally (Y-axis) to reveal a back side. The front shows an icon and title and the back shows a detailed description. Use CSS perspective, backface-visibility, and rotateX/Y transforms. Trigger the flip on hover. Add a smooth transition.