React

React badges.

Badges, with previews you can look at before you pick. Your agent builds the one you choose into your project as real files.

Badge

A compact HUD-style badge with dot, pulse, size, and status variants.

ReactTailwind
Badge

A compact label for status, category, or metadata.

ReactTailwind
Badge

A compact status, count, or label marker attached to another element to draw attention to new or important information.

ReactTailwind

Status pill with motion that draws attention to changing labels or states.

ReactTailwindBadge

A luminous credential badge held together by curl-noise embers, carved typography, rain occlusion, waterline sparks, and an adaptive particle field.

React
Chip

A compact selectable or removable chip with monospace HUD styling.

ReactTailwind
Tag

A dismissible status tag with size, color, and optional glow variants.

ReactTailwind
8-bit Badge

Compact label for statuses, categories, or counts with pixel borders.

ReactTailwindBadge
Badge Overflow

A component that measures available space and displays only the badges that fit with an overflow indicator.

ReactTailwindList

Status badge with animated state icons, pulse feedback and compact size variants.

ReactTailwind
Achievement Badge

An achievement badge with locked and unlocked states, progress rings, and rarity levels.

ReactTailwind

One link, one round trip

Ask your agent for a badge and pick from these.

Your agent brings together possibilities for your project. Explore what speaks to you, then let it build from your choices.

Connect your agent