Components / Navigation
MobileNav
Safe-area-aware mobile bottom navigation.
Preview
1import { Home, User } from "lucide-react"2import { MobileNav } from "@/components/ui/mobile-nav"3
4export function MobileNavDemo() {5 return <MobileNav activeId="home" items={[{ id: "home", label: "Home", icon: <Home /> }, { id: "profile", label: "Profile", icon: <User /> }]} />6}Installation
Add the source directly to your project with the shadcn CLI.
npx shadcn@latest add qentrah/DUI/mobile-navUsage
Install the component, import it from your configured UI directory, and adapt the source to your product. Open the source panel under any example to copy that exact variant.