Badge
A badge is a small piece of information that is used to convey a specific message or status. It is often used to provide additional context or information about an item, such as a notification count, status indicator, or label.
Badges display counts, small information indicators, or status markers that are attached to other interface elements.
Basic Badge
Examples of badges containing text, primarily using the badgeContent prop.
4
Dot Badge
The dot badge shows a small dot indicator without any content.
Badge Colors
Use the color prop to apply theme palette colors to badges.
44444
Badge Position
Use the anchorOrigin prop to change the position of the badge.
4444
Badge with Avatar
Badges can be used with avatars to show user status.
U
