Skip to main content

Badge

Above icon without number​

Used in notifications or when the new item count is irrelevant. In this case, the badge has no information inside it.

Above icon with number​

Counts values between 1 and 99. From 100 onwards, the "+" sign must be used after the second digit.

Beside text (other than Tags)​

The Badge can also be applied next to texts, to indicate quantity or change in quantity of information.

Inside Button or IconButton component​

Without children​

Kinds​

Neutral​

Accounting for something neutrally.

Warning​

Accounting for something that has a level of criticality, that is, it is something that should be seen as soon as possible. Example: Items removed, problems, errors found, notifications, among others.

Success​

Accounting for something that has a positive impact or indicates success.

Feedback​