Horizontal tabs with a thin bottom rail and a primary underline under the active label.
Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.
import { Nav4 } from "@/components/beste/piece/nav4";
<Nav4
tabs={[
"Overview",
"Analytics",
"Audience",
"Settings"
]}
activeIndex={1}
/>Classic folder-style tabs that sit on a rail, with the active tab bordered and notched into the panel.
Underline tabs that print a pill count next to the label, with the active count filled in primary.
Sidebar-style stack of icon + label rows where the active row gets a muted fill and bolder text.
Rounded segmented tabs riding a muted track, with a raised card sliding under the active label.
Mobile tab bar with labeled icons, a raised center create button, and a rose unread counter badge.
Docs-style on-this-page list with left borders and a primary active rail on the current section.