Tag Cloud

Language tags wrapping naturally across lines with 8px gap.

JavaScriptTypeScriptRustPythonGoFLINRubyJavaSwiftKotlin

Larger Gap

Status badges with 16px gap for more breathing room between items.

ActivePendingExpiredDraftFeatured

Text Editor Toolbar

Icon buttons that wrap to fit the container width. Resize to see wrapping.

Filter Chips

Selectable filter options that wrap within a card.

Categories
AllDesignDevelopmentMarketingAnalyticsSupport

Avatar Group

Wrapping avatars for team member displays.

A
B
C
D
E
F
G
H

Action Buttons

Button group that wraps responsively for narrow containers.

Usage

<Wrap gap="8"> <Badge>JavaScript</Badge> <Badge>TypeScript</Badge> <Badge>Rust</Badge> <Badge>Python</Badge> <Badge>Go</Badge> <Badge>FLIN</Badge> ...</Wrap><Wrap gap="16"> <Badge type="success">Active</Badge> <Badge type="warning">Pending</Badge> <Badge type="danger">Expired</Badge></Wrap>

Props

PropTypeDefaultDescription
gaptext"16"Space between items in pixels
childrencontent-Items to wrap - badges, buttons, tags, or any elements