Badges
Badge generates a small badge to the top-right of its child(ren).
Simple Badges
Examples of badges containing text, using primary and secondary colors. The badge is applied to its children.
Dot Badge
The dot
property changes a badge into a small dot. This can be used as a notification that something has changed without giving a count.
Badge visibility
The visibility of badges can be controlled using the invisible
property.
The badge auto hides with badgeContent is zero. You can override this with the showZero
property.
Customized badges
Here is an example of customizing the component. You can learn more about this in the overrides documentation page.