Installation
Run this in a project that already uses shadcn/ui. The CLI adds the block, its components and npm dependencies.
pnpm dlx shadcn@latest add https://ui.sumansharma.info.np/r/hero-section-7.jsonPrefer to iterate with AI?Open in
Usage
The CLI writes the block to components/hero-section.tsx. Import it anywhere:
Loading...
More hero section blocks
View all 9 →- Hero Section 101Dark hero with an animated headline, announcement pill, dual CTAs, a product screenshot and a logo strip.
- Hero Section 202Centered hero with animated text, a floating header and a light/dark product screenshot.
- Hero Section 303Minimal hero with an email capture form, animated copy and a customer logo cloud.
- Hero Section 404Split hero with a bold headline, abstract artwork and an infinite logo slider.
- Hero Section 505Full-bleed video hero with a sticky header and an infinite logo slider.
- Hero Section 606Product hero with a newsletter input, announcement link and an app screenshot.