Showreel
A large poster with a play button that follows the cursor; it opens your reel in a full-screen player (or plays it in place), with a duration label and a quiet coming-soon state.
Installation
pnpm dlx shadcn@latest add @portfolio-kit/showreelFirst time? Add the @portfolio-kit registry to components.json
components.json
{
"registries": {
"@portfolio-kit": "https://www.parthjadhav.com/products/portfolio-kit/r/{name}.json"
}
}Usage
Examples
Inline
mode="inline" plays the reel inside the frame instead of full screen. Here the frame is portrait on phones and widescreen from md up.
Coming soon
Leave out src while the reel is still in the edit: the poster stays, and the play button becomes a quiet label.
With a preview loop
Add preview for a short, muted loop behind the play button. It plays only while on screen and never loads under reduced motion or Save-Data, where the poster stays.