TubelightNavbar
1.0.0Floating pill navigation with a sliding active highlight and a primary-token tubelight glow on the current item.
npx jabkit add tubelight-navbarComponent Data
- ID
- tubelight-navbar
- Category
- marketing
- Version
- 1.0.0
- Added
- 2026-09-05
- Type
- block
- Keyboard nav
- Yes
- Reduced motion
- Yes
navbarmarketingnavigationheaderpilltabsmobile
Dependencies
- lucide-react
- clsx
- tailwind-merge
Examples
Default
<div className="min-h-80 bg-background text-foreground">
<TubelightNavbar {...tubelightNavbarMocks.default} />
</div>Variants
<div className="min-h-80 bg-background text-foreground">
<TubelightNavbar {...tubelightNavbarMocks.alternate} />
</div>