Badge

Documentation and examples for badges, a small component used for counting and labeling.

Badges are simple components used for counting, notifications, and labeling items. They're small, colorful and can easily draw attention to them.

Color Variants

Inkline includes several predefined badge color variants, each serving its own semantic purpose, which you can control using the color property.

Size Variants

You're able to use the size modifier to control the text and spacing size of your badges, using one of the available sizes: sm, md, and lg.

Relative Size

Badges always match the size of the immediate parent element by using relative font sizing and em units.

Props

Slots

Design Tokens