Header Scroll Pill
- from @ns-ui
A page header that morphs between a full-width quiet nav bar at the top and a floating centered pill once scrolled: spring-like width/radius/padding morph, section label roll, and a progress hairline, with hysteresis so it never flutters at the threshold and a fast upward scroll flicks it back open with overshoot.
Install
New to shadcn? Set up your project
If your project already has a shadcn components.json, skip initialization. Otherwise, run this once from your project root.
pnpm dlx shadcn@latest initpnpm dlx shadcn@latest add @ns-ui/header-scroll-pillLive preview
No live preview has been built for this component yet.
Registry dependencies0
The CLI adds no other registry items with this one.
Packages0
No npm packages are installed with it.
