# Badge
This component allows you to create different badge styles.
## Usage
To create a badge, apply the ```.badge``` class to an element. Badges have no default style. To apply the default style, add the ```.badge-default``` class.
new
new
```html
new
```
-----------
## Shapes
You can apply three different badge styles. By default, a badge has a slightly rounded style. Use the ```.badge-squared```class to apply a square style, or the ```.badge-rounded``` class to round the badge to the maximum.
squared
rounded
```html
new
new
```
-----------
## Caption
It is possible to add static text to a badge using the ```[data-caption]``` attribute. This attribute allows you to display a text in the badge just after the original content of the element. If the content is modified dynamically via JavaScript for example, the static text will not be modified.
12
```html
12
```
-----------