Badges

Use these Tailwind CSS badge components to highlight important information, statuses, or counts in your application. These badges are designed and built by the Tailwind CSS team, and include a variety of different styles.

With border

With border on dark

Get the code

With border and dot

Get the code

With border and dot on dark

Get the code

Pill with border

Get the code

Pill with border and dot

Get the code

With border and remove button

Get the code

Flat

Get the code

Flat pill

Get the code

Flat with dot

Get the code

Flat pill with dot

Get the code

Flat with remove button

Get the code

Small with border

Get the code

Small flat

Get the code

Small pill with border

Get the code

Small flat pill

Get the code

Small flat with dot

Get the code

Small flat pill with dot

Get the code