Web-app bottom bar with five labeled icon tabs and a primary indicator above the active one.
New here? Read the installation guide.
import { Nav25 } from "@/components/beste/piece/nav25";
<Nav25
tabs={[
{
"label": "Home",
"icon": "home"
},
{
"label": "Explore",
"icon": "explore",
"active": true
},
{
"label": "Inbox",
"icon": "inbox"
},
{
"label": "Alerts",
"icon": "notifications"
},
{
"label": "Me",
"icon": "profile"
}
]}
/>Mobile tab bar with labeled icons, a raised center create button, and a rose unread counter badge.
Horizontal tabs with a thin bottom rail and a primary underline under the active label.
Four-tab navigation pill that expands the active tab to show its label, with a count badge on alerts.
Segmented icon tabs inside a bordered tray, where the active tab flips to the foreground color.