Overview
Badges are colored text elements containing small bits of information. They are used for labeling content, displaying metadata, and highlighting information.
Steps for configuration:
Go to Component
Search the badge component drag and drop the badge component in the Layout
...
Configurations of a Badge component
...
Label: To Badge label is used to give the identity for a badge which display on UI UI
Variant: Users can set various types of variants for text content the badge which are is displayed in different color formats .according to their conditions
The badge comes in a five variants
Default: Default is used to display the default color of the badge
Inverse: Inverse is used when you need higher contrast than our default badge which is displayed in grey color
Lightest: This badge Lightest is used when you need higher contrast, such as on colored backgrounds.
Success: Success is used to communicate success which is displayed in green color
Warning: Warning is used to communicate warning which is displayed in orange color
Error: Error is used to communicate an error which is displayed in red color
...