Animated Card Stack Components
Dev Design Library indexes 64 Animated card stack components from 21 open-source UI libraries, with the most coming from uselayouts, Watermelon UI, UI Lab, React Bits and Amicro Micro Transitions. Each one links to its page with the source code, a live preview where available, the library license and the install command. These are the card stack components tagged as animated: motion on hover, on scroll or on load, usually built with CSS transitions or Framer Motion. Card stack components belong to the Data display group.
Bounce CardsReact Bits · ReactCards bounce that bounce in on mount.
Banner Stackingtransitions.dev · HTML/CSS
Card Cascade StaggerAmicro Micro Transitions · ReactStack of cards that cascade into place one after another.
Throw DeckKokonut UI · ReactA pile of image cards you drag, flick off the top and send under the deck, with arrow keys and a details view.
Card DealerbeUI · ReactA card table with a face-down deck, a fanned hand and a discard pile. Cards arc across the table between them and flip…
Verse CardsVengeance UI · ReactNav trigger that fans a deck of cards up with a GSAP reveal
Queued message stackFluid Functionalism · ReactSonner-style stack of queued composer messages: collapsed cards fan out on hover (tap on touch), drag to reorder, a…
Accessible Actionuselayouts · ReactInteractive draggable card stack with 3D tilt, swipe-to-back gestures, click interactions, random rotation, and smooth…
Case Study Flip StackComponentry · ReactEditorial case study cards that fold upward on scroll to reveal the next story.
Scroll Flying CardsGreatUI · React
Diagonal Card StackRewamp UI · ReactExact recreation of the diagonal cascading card stream & stacked deck collapse animation.
Depth TilesSona UI · ReactAn infinite layered tile stack with autoplay, depth transitions, and horizontal drag navigation.
Card CueWatermelon UI · React
Card stackArc Library · ReactReview a deck one card at a time, with a throw and an undo.
Changelog StackUI Lab · ReactFiles each release card behind the stack like a hand riffling index cards.
Card StackVelora UI · ReactDeck that shuffles the top card to the back on a timer.
Interactive Fun FactsSpaceUI · ReactInteractive 3D stacked quiz game block with True/False feedback, live score counter, progression indicators, and…
Notification StackEaseUI · ReactA deck of notification cards: collapsed to the top card with peeking edges behind it, fanning into a readable list on…
Glass NotificationOpaline · ReactiOS notification banner plus a stack that fans out on hover.
Diagonal CarouselReactFrame · ReactSquare cards fan out diagonally into a stacked deck, each inactive card rotates and offsets away from the active one…
Card StackAceternity UI · React
Card SwapReact Bits · ReactCards animate position swapping with smooth layout transitions.
Card Stack Hovertransitions.dev · HTML/CSS
Smart Card DispenserAmicro Micro Transitions · ReactCredit card dispensing slot ejecting smart pass upwards on trigger.
Bookshelfuselayouts · ReactA shelf of cloth-bound books. Pull one out and it opens on the desk: covers swing on a hinge and pages turn by the…
Layered StackComponentry · ReactA stack of layered cards that interact with mouse hover.
Perspective Flip DeckRewamp UI · ReactExact recreation of Recording 2026-09-15 154736.mp4: 3D isometric perspective fanned card deck. When cycling, the…
Fan ViewSona UI · ReactA fanned card menu with controlled state, item callbacks, keyboard dismissal, outside-click handling, and…
Card Cue BaseWatermelon UI · React
Stacked DrawerUI Lab · ReactStacks iOS sheets that push the page back and drag down to dismiss.
Featured testimonialVelora UI · ReactOne rotating quote with crossfading portraits, framed by a beam card over a row of counting stats.
ToastEaseUI · ReactToasts that stay long enough to read based on their word count, and pause while hovered or while the tab is in the…
Glass Scroll StackOpaline · ReactGlass cards that pin and pile up as you scroll, shrinking as new cards land on them.
Image Deck 3DReactFrame · ReactA single image split into a stacked deck of shape-clipped layers (rectangle, circle, hexagon, star, blob and more)…
TabsAceternity UI · React
Scroll StackReact Bits · ReactOverlapping card stack reveals on scroll with depth layering.
Card Time MachineAmicro Micro Transitions · React
Editorial Deckuselayouts · ReactA stacked editorial story deck. Drag the front card and it springs back into the pile.
Orbit Card StackComponentry · ReactPremium hover card deck that fans outward and lifts the active card without changing its color or angle.
Notification StackSona UI · React
Card SwipeWatermelon UI · React
Sticky StackUI Lab · ReactCards pile up and sink back as you scroll.
Glass StackOpaline · ReactA deck of glass cards — swipe the top one away to reveal the next.
StackReact Bits · ReactLayered stack with swipe animations, autoplay and smooth transitions.
Card Deck CascadeAmicro Micro Transitions · React
Memory Card Stackuselayouts · ReactA fanned deck of five photographs. Start brings the top card up, then you page through it with the controls or throw…
Sticky Scroll CardsComponentry · ReactA scroll-driven card stack where images pin and scale as you scroll, creating a layered depth effect.
Layered Progressive DisclosureWatermelon UI · React
Swipe DeckUI Lab · ReactFling a card away and the rest of the deck steps forward.
Glass ToastOpaline · ReactImperative toasts on glass that stack into a deck, fan out on hover and swipe away.
Photo Albumsuselayouts · ReactTilted album stacks that expand into a shared-element photo grid.
List StackWatermelon UI · React
Wallet CardsUI Lab · React
Polaroid Stackuselayouts · ReactSeven Polaroids sit in a pile. Hover and they fan into an arc from one corner.
List Stack BaseWatermelon UI · React
Pop Tilt Cardsuselayouts · ReactInteractive tilt card deck with smooth hover animations, 3D popping effects, images, links, and customizable card…
Revealing CardsWatermelon UI · React
Rolling Card Stackuselayouts · ReactIt’s a responsive, animated rolling card stack component built with React, TypeScript, Tailwind CSS, and Framer…
Revealing Cards BaseWatermelon UI · React
Scroll Stack Deckuselayouts · ReactScroll-linked project cards that pin in the viewport and stack, scale, and settle as you move down the page.
Wiggling CardsWatermelon UI · React
Stack Scroll Revealuselayouts · ReactScroll-linked case-study cards that pin in the viewport and peel, scale, and fade as you move down the page.
Wiggling Cards BaseWatermelon UI · React
Stacked Listuselayouts · ReactAn expandable list widget with a stacked layout and smooth morphing transitions.
Libraries with Animated card stack components
Related categories
- Card Stack Components
- React Card Stack Components
- Tailwind CSS Card Stack Components
- Animated Data Display Components
- Animated Card Components
- Animated Chart Components
- Animated Carousel Components
- Animated Accordion Components
- Animated Stat Components
- Animated Collapsible Components
- Animated Counter Components
- Animated List Components
- Animated Avatar Components
- Animated Table Components
- Animated Tree View Components
- Animated Avatar Group Components
- Animated Line Chart Components
- Animated Timeline Components
- Animated Testimonial Components