Three stack behaviours
Different exit paths, tilt angles and spacing, each independently usable.
3D and WebGL Templates · v1.0.0
Deck
Cards stack and recede into a three-dimensional deck.
Rated 4.7 out of 5 based on 42 reviews.680 sold3 variationsUpdated September 20, 2026
01 / 04Click to enlarge
3DStackScrollMonospace
Overview
Deck layers cards into a receding stack and animates through them on scroll - the front card lifts away, the rest advance, and the whole pile tilts in perspective. Three stack behaviours ship, differing in angle, spacing and how cards exit.
Kode Mono throughout gives it a technical, spec-sheet character that suits product and engineering content.
Best for: Feature walkthroughs and case-study sequences that benefit from a sense of order.
What makes it different
Genuine Z-depth
Cards occupy real positions in 3D space rather than faking depth with scale.
Kode Mono
Self-hosted - and the exact face the original used, restored rather than substituted.
No build step
Static files with GSAP vendored locally.
In the box
- 1 page with 3 stack galleries
- GSAP 3.15 + ScrollTrigger + Lenis, vendored
- Self-hosted Kode Mono
- 9 sample images
Built with
- GSAP 3.15
- ScrollTrigger
- Lenis
- CSS 3D
Questions about Deck
Can cards contain arbitrary content?
Yes - they are ordinary divs. Text, forms and video all work; only very tall content needs the spacing adjusted.
How many cards per stack?
Three to eight reads best. More than that and the back of the stack is not visible anyway.
Still unsure? Email us - or read how to choose a template.
Related
