Interfaces Badge

Rounded pill badge component from Interfaces DS with default, secondary, destructive, and outline variants.

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

import { Badge } from "@/components/ui/interfaces-badge"

export default function DefaultBadgeDemo() {
  return (
    <div className="flex min-h-screen w-full items-center justify-center bg-background p-8 overflow-hidden">
      <Badge>Badge</Badge>
    </div>
  )
}