All components
Depth Field Cards
Product & UIA field of cards on four depth planes with real depth of field and aerial perspective, revealed by one long lateral camera move
Download preview768×432 preview render — the full-resolution file comes from running the component
8 seconds
Format
This is the format it was composed for. Switch above to see it lay itself out for another — same animation, re-arranged for the frame.
depth of fieldparallaxcamera moveproductcardspremium
For developers — source, dependencies and provenance
Dependencies
remotion@remotion/shapeszod
No Tailwind, no CSS, no asset files. Inline styles only.
Source
Filesrc/registry/items/depth-field-cards.tsx
Frame1920×1080
Duration240f · 8s @ 30fps
Provenance
ToolClaude Code
ModelOpus 5
Authormotionstash
LicenseMIT
Prompt
A wide product frame with genuine depth: cards arranged on several distinct depth planes, each plane with its own blur and its own parallax rate, so one slow lateral camera move across the whole shot reveals the space. Distant planes should lose contrast into the background as well as sharpness, the way aerial perspective works. Keep one card and the headline in the sharp focal plane.
