A clean, expandable card that reveals rich content on tap — perfect for packing more information into less space without overwhelming your layout. The collapsed state highlights your image, while a single tap expands to reveal titles, stats, and descriptions. Smooth, satisfying animation with full control over content and styling. No code required.
Features
Tap-to-expand and collapse with smooth animation
Collapsed state showcases a full-width image
Expanded state reveals title, subtitle, stats row, and description
Built-in stat metrics display (distance, coverage, duration, etc.)
Chevron indicator for clear expand/collapse affordance
Fully controlled via Framer properties — no code needed
Lightweight and performant
Use Cases
Trail, destination, or travel spot showcases
Product cards with image + detailed specs reveal
Portfolio project cards with hidden case study details
Real estate or property listing previews
Event cards with venue info and schedule details
Team member profiles with expandable bios
Built For
Designers who want compact, content-rich card layouts without clutter
Developers looking for a drop-in, expandable card with zero setup
Marketers building information-dense landing pages that stay clean
How to Use
Drag the component onto your Framer canvas
Set your image, title, subtitle, stats, and description content
Customize card width, border radius, and styling via properties
Preview the expand and collapse interaction
Publish — your expandable card is live!
Vraj Parikh
