Badge Components

A dismissible badge component featuring a secondary variant, hover opacity effects, and an integrated Lucide X icon for removing items from a list.

A minimalist outline badge featuring an integrated Lucide check icon and text, designed for status indicators and visual labels using Tailwind CSS.

A status indicator component featuring an outlined badge with a small, colored circular dot to represent different states like success, info, or destructive.

A minimalist status indicator component featuring a transparent background with a subtle border, styled using the shadcn UI badge variant.

A destructive variant badge component featuring a high-contrast red background for highlighting critical status indicators, errors, or alerts in a clean, minimalist UI style.

A secondary variant badge component used for displaying status indicators or labels with a muted background color style.

A minimalist status indicator component built with Tailwind CSS, designed to display short labels or tags for categorization and state highlighting.

A neubrutalist-style sticker component featuring customizable rotations, hard-edge shadows, and optional decorative tape or dashed border effects for a playful, hand-crafted aesthetic.

A neubrutalism-styled badge featuring a bold border, high-contrast typography, and a distinct drop-shadow effect that shifts on hover to create an interactive, tactile feel.

A status badge featuring smooth Framer Motion entrance and exit animations for icons and text, with optional pulse feedback, multiple color states, and two size variants.

A lightweight, customizable label component used for displaying status indicators, tags, or categories with support for variant styling and icon integration.

A versatile, accessible badge component featuring multiple visual variants, support for icon integration, and focus-visible ring states for improved keyboard navigation.

A text message component that parses directive syntax and renders inline badges with optional icons, designed for AI chat interfaces to display structured metadata within text content.

A versatile, accessible badge component featuring multiple semantic color variants, size options, and support for polymorphic rendering via asChild, built with Tailwind CSS and class-variance-authority.

A source citation component that displays website favicons or document icons within a clickable badge, featuring automatic domain extraction and fallback initials for external links.

A versatile badge component featuring multiple color variants, including fancy gradient, regular, and outline styles, built with Tailwind CSS and class-variance-authority for flexible status labeling.

An animated checkmark badge icon built with Motion, featuring customizable path-drawing animations and scale effects for interactive status indicators.

A placeholder component displaying a notice for account-required installations, featuring a monospaced font style and neutral color palette for clear informational messaging.

A lightweight, customizable badge component designed for displaying status labels, tags, or notifications with a clean, minimalist aesthetic compatible with Tailwind CSS.

An interactive badge featuring a folder-style container that fans out and elevates multiple images with smooth Framer Motion animations upon hover.