Badge Row

A flex-wrapped row of Badge components for tags, categories, skills, and status collections. Controls overflow gracefully and prevents arbitrary color usage for status mapping.

datasimple

1024px

ReactTypeScriptNext.jsTailwind

API DesignRESTGraphQLWebSocketsAuth

Variations

Outline

All badges use the secondary/outline style — for neutral tag collections without semantic meaning.

1024px

Design SystemsFigmaTokensComponents

Node.jsPostgresRedisDockerK8s

Mixed Variants

Each badge carries its own semantic variant — for status collections where each item has a different state.

1024px

StableBetaDeprecatedDraft