Components
Loading preview...
A navigation aid that shows users their current location within a website or application hierarchy
npx shadcn@latest add https://21st.dev/r/preetsuthar17/breadcrumbimport { Home } from "lucide-react";
import {
Breadcrumb,
BreadcrumbList,
BreadcrumbItem,
BreadcrumbLink,
BreadcrumbPage,
BreadcrumbSeparator
} from "@/components/ui/breadcrumb";
export default function DemoOne() {
return (
<>
<Breadcrumb>
<BreadcrumbList>
<BreadcrumbItem>
<BreadcrumbLink href="#">
<Home className="h-4 w-4" />
Home
</BreadcrumbLink>
</BreadcrumbItem>
<BreadcrumbSeparator />
<BreadcrumbItem>
<BreadcrumbLink href="#">Documentation</BreadcrumbLink>
</BreadcrumbItem>
<BreadcrumbSeparator />
<BreadcrumbItem>
<BreadcrumbPage>Breadcrumb</BreadcrumbPage>
</BreadcrumbItem>
</BreadcrumbList>
</Breadcrumb>
</>
);
}