Dealt Team Cards
A team section that deals itself out. Dashed placeholder frames rise into their slots as the section approaches, each popping its giant initial once the frame is most of the way up. The section then pins and the real cards fly in from off to the right, rotating flat and scaling up on staggered windows, so the last card is still arriving while the first has settled. GSAP ScrollTrigger with Lenis.
npx shadcn@latest add https://ui.aryank.space/r/dealt-team-cards.jsonInstalls from ui.aryank.space. To add it by hand, copy the files in Usage below, or register the @compronents namespace via the docs.
| Prop | Type | Default | Description |
|---|---|---|---|
| members | TeamMember[] | Three BLANK team members | First name, last name, role, and portrait. The giant placeholder initial is taken from the first name. |
| heroHeading / outroHeading | string | BLANK copy | Copy on the screens around the team section. |
| embedded | boolean | true | Own the scroll container so it fits a bounded box. Set false to drive it from the window scroll. |
memberstextNames, roles, and portraits.
heroHeading / outroHeadingtextThe lead-in and closing screens.
gsaplenis