:::cs
[!ref icon="link" text=""](https://retype.com/components/)

## Alerts
=== Varianten

||| ohne Titel 
!!! 
Standard  
!!!  
||| Code
~~~md
!!! 
ohne Titel
!!!
~~~
|||

||| mit Titel
!!! Alerttitel
Beispiel
!!!
||| Code
~~~md
!!! Alerttitel
Beispiel
!!!
~~~
|||

### Varianten
  - `secondary` 
  - `success` 
  - `danger` 
  - `warning` 
  - `info` 
  - `light` 
  - `dark`
  - `ghost`
  - `contrast`
  - `contrast` 
===

## Badge
=== Badge
||| mit Link
[!badge Badge](badge.md)  

||| Code
~~~md
[!badge Badge](badge.md)  
~~~
|||

||| ohne Link
[!badge Badge]
||| Code
~~~md
[!badge Badge]  
~~~
|||

||| Varianten
[!badge variant="info" text="Info"]
||| Code
~~~md
[!badge variant="info" text="Info"]
~~~
weitere [s.o.](#Varianten)
|||

||| Form
[!badge text="Default"]  
[!badge corners="square" text="Square"]  
[!badge corners="pill" text="Button Pill"]  
||| Code
~~~md
[!badge text="Default"]  
[!badge corners="square" text="Square"]  
[!badge corners="pill" text="Button Pill"]
~~~
|||

||| Size
~~~md
[!badge size="m" text="Medium"]
~~~
||| Options
`xs` - `3xl`
|||

||| Icons & Emojis
[!badge variant="info" icon="person" text="User" margin="0 8 0 0"]  
[!badge variant="primary" icon="paper-airplane" iconAlign="right" text="Send"]  

[!badge variant="light" icon=":heart:" text="Like"]  
[!badge variant="info" icon=":rocket:" iconAlign="right" text="Rocket"]  
||| Code
~~~md
[!badge variant="info" icon="person" text="User" margin="0 8 0 0"]  
[!badge variant="primary" icon="paper-airplane" iconAlign="right" text="Send"]  

[!badge variant="light" icon=":heart:" text="Like"]  
[!badge variant="info" icon=":rocket:" iconAlign="right" text="Rocket"] 
|||
===
:::