<div class="badge">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-4 h-4 stroke-current">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
</svg>
Badge
</div>
@jrmc.badge({ as: 'div' })
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-4 h-4 stroke-current"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path></svg>
Badge
@end
Doc : daisyui badge
Badges are used to inform user of the status of specific data.
| Class name | Type | |
|---|---|---|
| badge | Component | Container element |
| badge-outline | Modifier | transparent badge with [colorful] border |
| badge-lg | Responsive | badge with large size |
| badge-md | Responsive | badge with medium size (default) |
| badge-sm | Responsive | badge with small size |
| badge-xs | Responsive | badge with extra small size |
| badge-primary | Responsive | badge with primary color |
| badge-secondary | Responsive | badge with secondary color |
| badge-accent | Responsive | badge with accent color |
| badge-ghost | Responsive | badge with ghost color |
| badge-info | Responsive | badge with info color |
| badge-success | Responsive | badge with success color |
| badge-warning | Responsive | badge with warning color |
| badge-error | Responsive | badge with error color |