Cards
Throw Deck
A hand-squared pile of matte picture cards; flick the top card and it flies off and tucks under the pile. No titles, no details view.
svgmedium complexitymoderate motionpointer+keyboardmobile-readyaccessible
Open on the canvas to copy the code → Free account · 3 copies a day · membership goes unlimited
1
When to use it
A playful gallery of a few pictures, product moods or moments.
When not to
Content that needs captions, prices or random access.
Working with an AI agent
Every component ships agent-ready metadata. An example instruction for this one:
Matte paper register (clay, sand, sage, slate, dusty blue on #1C1B18 / #F4F1EA). Edit --td-* tokens; swap the .td-c SVG scenes and NAMES; SL holds pile tilts.
Safe to edit
- --td-* tokens
- card SVG scenes + NAMES
- SL pile offsets
Keep intact
- IIFE + prefix, reduced-motion, visibilitychange, theme hook, demo-v1
Known limitations
- Demo state resets on remount
More Cards components
- 3D Tilt ParallaxDark card tilts in 3D toward the cursor; badge, orb, and text layers float at distinct Z-depths. A radial shine tracks the pointer; auto-rotates until…
- Frosted GlassA frosted glass card floats over three slowly drifting color blobs (gold, cream, tan); the panel lifts slightly on hover.
- Gradient-Border GlowDark card framed by a spinning conic powder-blue, tan and slate gradient border with a soft blurred aura glow behind it; auto-rotates continuously.
- Reveal on HoverDark gradient card that dims and zooms its background art on hover while a hidden title-and-copy panel slides up from the bottom.
- Holographic IridescentA 3D-tilting card with a warm iridescent sheen and conic foil chip that shift with pointer position; drifts idly until first deliberate input.
- Stacked Peeking CardsThree layered gradient cards auto-cycle and fan out with a springy rotation on hover; cards spread left and right then restack when cursor leaves.