Tags Breadcrumb

Component 9

About

A tag list Breadcrumb component with counters, ideal for displaying categories, filters, or topics with their associated counts.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Tags Breadcrumb to your project and fits it to your theme.

Code

How Tags Breadcrumb is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import { Breadcrumb } from "@/components/ui/tags-breadcrumb";

export default function DemoOne() {
  return <Breadcrumb
        tags={[
            { name: "design", href: "#", count: 128 },
            { name: "ui", href: "#", count: 86 },
            { name: "ux", href: "#", count: 54 },
            { name: "inspiration", href: "#", count: 32 },
          ]}
      />;
}