# Card Fan — Framer Component
## Short Description
Interactive card fan component for Framer. Unlimited cards, cascade reveal on scroll, hover with lift + spread + depth darkening. Full property panel control.
---
## Full Description
Cards cascade into view on scroll and respond to hover — the active card lifts, neighbors spread, inactive cards darken. Connect any Framer components as cards. No card limit.
Two reveal animations: Scale Up (cards grow into position) and Fan Out (cards unravel from a compressed stack). Four cascade directions. Scroll-triggered. Mobile tap support with automatic device detection. Keyboard accessible.
15+ property controls — gap, lift, spread, reveal timing, hover speed, shine, darkening, optional text companion, auto-replay, and more. No code after install.
---
## What's Included
- CardFan.tsx — the full unlimited component
- CardFanMini.tsx — free 4-card version (also included as a bonus)
- Both components, ready to drop into any Framer project
---
## What You Can Build With It
- Hero sections with visual depth
- Product showcases and feature highlights
- Portfolio galleries
- Image carousels that feel premium
- Landing page visual moments
---
## Features
- Unlimited card slots
- Scale Up + Fan Out reveal animations
- 4 cascade directions (left, right, center-out, edges-in)
- Scroll-triggered with configurable threshold
- Hover lift with neighbor spread
- Depth darkening on inactive cards
- Specular shine overlay on active card
- Optional text companion (left or right side)
- Auto-replay mode
- Mobile tap-to-lift (auto-detect or force)
- Keyboard + screen reader accessible
- Performance optimized (rAF throttling, memoized styles, timer cleanup)
---
## Benefit Bullets
- ✓ Unlimited card slots — no cap on how many components you connect
- ✓ Two reveal animations with 4 direction options
- ✓ Hover interactions: lift, spread, darken
- ✓ Mobile-ready with automatic tap detection
- ✓ Full Framer property panel — no code needed
- ✓ Includes the free Mini version as a bonus
Michael Slotta
