Photo Card

ThreeDCard transforms static photos into an elegant, layered 3D showcase. Each card tilts and scales interactively on hover, giving your images depth and motion. The design features two overlapping photo cards with realistic shadows and customizable captions, placed on a softly animated grid background that adapts to light or dark themes.

Built entirely with React and CSS3 animations, ThreeDCard is lightweight yet cinematic—ideal for hero sections, photography portfolios, and project previews where subtle interactivity creates a premium feel.

Key Features

• 3D Hover Motion — Smooth tilt and scale effects bring your cards to life.

• Animated Grid Background — Adds subtle motion and visual depth.

• Dual Layer Layout — Two overlapping photo cards for a realistic stack feel.

• Customizable Captions — Adjust font, color, and typography with full control.

• Theme Adaptive — Light and dark modes for seamless integration.

• Fully Customizable — Tweak card size, rotation, padding, shadows, and animation.

• Performance Optimized — Pure CSS and React; zero dependencies.

Use Cases

• Creative and photography portfolios

• Landing page hero sections

• Product previews and lookbooks

• Minimalist galleries and showcases

• About sections with image storytelling

How to Use

1. Drag ThreeDCard onto your Framer canvas.

2. Upload or select your two photos.

3. Edit captions to describe your images.

4. Adjust Card Size, Rotation, and Shadow for your layout.

5. Toggle Theme between light or dark for automatic background styling.

6. Enable or disable the Grid Background for extra motion.

Your gallery now features smooth, responsive 3D motion that enhances engagement and depth—perfect for modern visual storytelling.