Hero Video
A full-bleed hero over a muted, looping background video, with a legible scrim and a visible pause button; it shows the poster under reduced motion or Save-Data and rests while off screen.
UsesSection
Installation
pnpm dlx shadcn@latest add @portfolio-kit/hero-videoFirst 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
With Scroll Cue
A photographer’s landing: just the name and the year’s project at the bottom, a scroll cue linking to the work, and the pause button beside it.
Inset
A shorter, rounded video band inside the page column with centered copy on a full scrim, for a studio page that opens with a header above it.