Breadcrumb
A breadcrumb navigation trail with links and a current-page indicator.
Installation
bunx shadcn@latest add https://ui.razeev.com/r/breadcrumb.jsonUsage
tsx
import { Breadcrumb } from "@/components/hangry-ui/components/breadcrumb";
<Breadcrumb items={[{ label: "Home", href: "/" }, { label: "Settings" }]} />Props
| Prop | Type | Default | Description |
|---|---|---|---|
items | { label: string; href?: string }[] | Home → Components → Breadcrumb | Navigation items. The final item is the current page; earlier items with href become links. |
className | string | "" | Additional CSS classes on the component root. |
Native props | ComponentProps<"nav"> | — | Forwards native nav attributes, aria-* attributes, and event handlers. |
Setup notes
Use Tailwind CSS v4. Borders use the global border-border token. No rounded classes or additional packages are required. Customize content with props and styling with className.