Marquee Carousel Scroll
A pinned carousel where each project arrives as a wedge. Scrolling forward tilts the incoming slide's clip path up from the bottom edge while the outgoing one closes off the top, and the image and copy inside slide at different rates so the layers separate as they cross. Each title is tripled and marqueed on an infinite linear loop, and a row of segmented bars fills one at a time to show position in the set.
npx shadcn@latest add https://ui.aryank.space/r/marquee-carousel-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 |
|---|---|---|---|
| slides | MarqueeSlide[] | Five BLANK projects | Tag, marquee headline, and image. Pin length and the progress bar count both scale to how many are supplied. |
| brand / navItems / introCopy / outroCopy | string / string[] | BLANK copy | Navigation and the screens either side of the carousel. |
| embedded | boolean | true | Own the scroll container so it fits a bounded box. Set false to drive it from the window scroll. |
slidestextTag, marquee headline, and image per project.
gsaplenis