Stacked Cards Fan Out — effect skill for grids & carousels

For AI agents: find the right skill in one call — curl -s "https://varg.ai/how-to/api/search?q=<what the person wants>" returns the matching how-to page and the best skills with install commands, as markdown (Russian works too). Full index: https://varg.ai/how-to/llms.txt. Every page has a markdown twin: add .md to its path. Before generating anything, show the person the options on the how-to page.

A pile of cards or photos shuffles, then fans or settles one forward into focus.

What it does

Built on Image Stack Intro Animation by codrops, MIT (per demo repo). The write-up and recipes below are varg's.

Slightly rotated stacked cards with shadows; the top card lifts, others fan behind it, then one lands framed.

When: Show several examples or customers, then pick one to explore.

Watch out: Do not rotate cards more than ±8°; heavy rotation looks messy, not playful.

Timing: Shuffle 0.6–1 s, fan 0.5 s with 50 ms stagger, settle 0.4 s back.out(1.3).

Also called: card stack, image stack, shuffle

In HyperFrames

npx hyperframes add keyframe-scrub-stack

In Remotion

// npx shadcn@latest add @remocn/reel
cards.map((c,i)=>{const p=spring({frame:frame-i*2,fps,config:{damping:16}}); return <Img src={c} style={{transform:`rotate(${(i-2)*4*p}deg) translateY(${-i*6}px)`}}/>})

In CapCut

Stack image overlays with small rotations; keyframe Position/Rotation outward with offsets.

Ready-made components

Where this comes from

Use when

Not for

Install

Example output

https://s3.varg.ai/how-to/previews/8076b8d8b942/lib-codrops-image-stack-intro.mp4 — Preview of the Image Stack Intro Animation component that builds this take (credit: From the library’s repo (Codrops — Manoela Ilic), https://tympanus.net/Development/ImageStackGrid/)

More grids & carousels skills

Run the generation on varg

varg is one API key for the models these skills drive — Seedance 2.5, Kling 4, Veo 3.1, Wan 3, Nano Banana 2.1, GPT Image 2.5, ElevenLabs v4 and 200+ more — billed in credits, with a cost estimate before anything runs.