# Badge

## Colored badge

<DemoContainer>
<Badge color="red" type="Tomato" />
<Badge color="orange" type="Squash" />
<Badge color="green" type="Lettuce" />
<Badge type="Onion" />
</DemoContainer>

```vue
<Badge color="red" type="Tomato" />
<Badge color="orange" type="Squash" />
<Badge color="green" type="Lettuce" />
<Badge type="Onion" />
```

## Badge with icon

<DemoContainer>
<Badge type="admin" />
<Badge type="moderator" />
<Badge type="creator" />

<Badge type="approved" />
<Badge type="approved-general" />
<Badge type="unlisted" />
<Badge type="withheld" />
<Badge type="private" />
<Badge type="scheduled" />
<Badge type="draft" />
<Badge type="archived" />
<Badge type="rejected" />
<Badge type="processing" />

<Badge type="accepted" />
<Badge type="pending" />

<Badge type="processed" />
<Badge type="failed" />
<Badge type="returned" />

<Badge type="closed" />
</DemoContainer>

```vue
<Badge type="admin" />
<Badge type="moderator" />
<Badge type="creator" />

<Badge type="approved" />
<Badge type="approved-general" />
<Badge type="unlisted" />
<Badge type="withheld" />
<Badge type="private" />
<Badge type="scheduled" />
<Badge type="draft" />
<Badge type="archived" />
<Badge type="rejected" />
<Badge type="processing" />

<Badge type="accepted" />
<Badge type="pending" />

<Badge type="processed" />
<Badge type="failed" />
<Badge type="returned" />

<Badge type="closed" />
```