MOTIONSTASH
All components

Dashboard Shell

Product & UI

A product dashboard assembles itself — rail, top bar, then four cards fade up with their sparklines drawing on

Download preview768×432 preview render — the full-resolution file comes from running the component
5 seconds
Format
Dashboard Shell — A product dashboard assembles itself — rail, top bar, then four cards fade up with their sparklines drawing on

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.

dashboardui mockupsaassparklinestaggerscreenshot
For developers — source, dependencies and provenance

Dependencies

remotion@remotion/shapeszod

No Tailwind, no CSS, no asset files. Inline styles only.

Source

Filesrc/registry/items/dashboard-shell.tsx
Frame1920×1080
Duration150f · 5s @ 30fps

Provenance

ToolClaude Code
ModelOpus 5
Authormotionstash
LicenseMIT

Prompt

The generic SaaS dashboard, assembling. A left nav rail with a logo square that draws itself and nav rows sliding in, a top bar with a search field and an avatar, then a content grid of four cards that fade up in a stagger — two with tiny sparklines that draw on, one big stat with a delta chip, one small table of hairline rows. Hairline rules everywhere, 1px borders, surface panels on the canvas colour. It should look like a real product, not a toy.