# 13 Animated React Card Components for Tailwind

> Cards with depth: 3D tilt with glare, cursor spotlight borders, flip cards, frosted glass, animated border beams, expandable details, swipeable stacks, product tiles and stat cards with sparklines.

3 of 13 free (the rest with PixelPapa Pro), built with Tailwind CSS and Motion, installable with the shadcn CLI.

- [Card 3D Tilt](https://pixelpapa.com/components/cards/card-3d-tilt.md) (Pro): A card that leans toward the pointer on springs, with a glare that tracks the cursor and layers floating at different depths.
- [Card Border Beam](https://pixelpapa.com/components/cards/card-border-beam.md) (Pro): A card with a comet of light travelling around its border, drawn with an animated conic gradient and a soft glow copy.
- [Card Expandable Detail](https://pixelpapa.com/components/cards/card-expandable-detail.md) (Pro): Compact rows that expand in place with a shared layout animation, pushing their neighbours aside on a spring.
- [Card Flip](https://pixelpapa.com/components/cards/card-flip.md) (Pro): A two-sided card that turns over on a spring when clicked or activated from the keyboard, on either axis.
- [Card Glass Frost](https://pixelpapa.com/components/cards/card-glass-frost.md): A frosted glass card with a lit top edge and fine grain, floating over slowly drifting colour blobs.
- [Card Hover Reveal Actions](https://pixelpapa.com/components/cards/card-hover-reveal-actions.md) (Pro): A media card whose artwork zooms on hover while quick actions spring in from the edge and a call to action rises from the footer.
- [Card Notification Stack](https://pixelpapa.com/components/cards/card-notification-stack.md): A loose pile of notifications that straightens and fans out from its centre into a readable list on hover or focus.
- [Card Pricing Mini Glow](https://pixelpapa.com/components/cards/card-pricing-mini-glow.md) (Pro): A compact plan card with a slowly rotating colour halo behind it and a light on the border that follows the pointer.
- [Card Product Hover](https://pixelpapa.com/components/cards/card-product-hover.md) (Pro): A product tile whose artwork recolours with the swatches and leans in on hover, with an add-to-cart button that morphs into a quantity stepper.
- [Card Profile Follow](https://pixelpapa.com/components/cards/card-profile-follow.md) (Pro): A profile card whose follow button springs into a confirmed state with a spark burst while the follower count rolls up.
- [Card Stack Swipe](https://pixelpapa.com/components/cards/card-stack-swipe.md) (Pro): A deck you fling left or right; the top card follows your drag with rotation, flies off with momentum and rejoins the back.
- [Card Stat Sparkline](https://pixelpapa.com/components/cards/card-stat-sparkline.md) (Pro): A KPI card whose sparkline draws itself in, then lets you scrub along it to read any point while the headline value follows.
- [Spotlight Card](https://pixelpapa.com/components/cards/spotlight-card.md): A card whose border and surface light up under the cursor like a torch on glass.