Wedge Clip Work Scroll
A work index where each project opens and closes like an aperture. The image starts as an angled wedge, widens to a full rectangle as the panel arrives, then folds shut from the bottom as it leaves. The project title is masked per character and each character gets its own short scroll window, so the name types itself upward slightly ahead of the image finishing its opening. GSAP SplitText and ScrollTrigger with Lenis.
npx shadcn@latest add https://ui.aryank.space/r/wedge-clip-work-scroll.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 |
|---|---|---|---|
| items | WedgeWorkItem[] | Five BLANK projects | Project name and image for each full-height panel. |
| heroHeading / outroHeading | string | BLANK copy | Copy on the screens around the index. |
| embedded | boolean | true | Own the scroll container so it fits a bounded box. Set false to drive it from the window scroll. |
itemstextProject names and their images.
heroHeading / outroHeadingtextThe lead-in and closing screens.
gsaplenis