Animation Engine

Sticky Card Stack

Pin a Section’s cards one after another so they stack as the visitor scrolls — the “deck of cards” scroll effect, in 11 styles (stack, scale & fade, blur, 3D tilt-back, fan deck, peel, push and more). Section-level; the cards are its full-width columns.

Deck-of-cards scroll

Cards that pile up as you scroll.

The Section below pins each of its cards in turn — they stack with a staggered offset as you scroll past. Build it as one Section with several full-width columns; pick one of 11 stack styles. Scroll down slowly.

First in the deck

First in the deck

Each card pins at the top, then the next slides up and stacks over it.

It stacks over

It stacks over

A staggered offset lets the card beneath peek through — the deck look.

And over again

And over again

Pure sticky positioning plus one scroll listener. No library, no jank.

Last card lands

Last card lands

Reduced-motion visitors just see the cards flow normally. Loads on-demand.

11 stack styles

How the cards transform as they pile

Card Stack

Scale & Fade

Fade

Blur

3D Tilt Back

Fan Deck

Messy Pile

Slide Aside

Peel

Push

Grow

How to set it up

Add it in under a minute

  1. Build one Section with several full-width columns — each column is a card.
  2. Open the Section → AnimationsSticky Card Stack.
  3. Pick a style and set the pin offset + stagger.
  4. Save and scroll — the cards pin and stack.

Free & open source

Build with this element, free.

Install the framework and the Bootstrap 5 theme, then drag this element into any page.