This is a core component available with all pages, that can be included with simple lines of code. You can use this to highlight a quick info regarding a label, text, etc.
You can add a badge next to a text line or in a Rich Text field with a code like this:
<span class="badge badge--medium badge--accent">New</span>
Here is an example with a Heading module:
Another example of a badge in the menu:
In a Rich Text field you'll have to open the source code pane:
Then find your text element and paste the code:
You can replace
badge--medium with one of the Size modifier classes below and the
badge--accent class with one of the Color modifier classes below.
You can add the
badge--lowercase to disable the uppercase text styling.
Here is an example of a large dark badge with the uppercase disabled:
<span class="badge badge--large badge--dark badge--lowercase">New</span>
Here are all the available classes: