Badge List Block
Display a row of styled tags or badges. Choose from preset colours and sizes to highlight categories, status indicators, or feature tags.
The Badge List block creates a horizontal row of coloured tags. Badges are useful for categorisation, status indicators, and highlighting key attributes in a compact visual format.
When to Use
Block Properties
| Property | Required | Description |
|---|---|---|
| Size | No | Badge dimensions: sm (small), md (medium), lg (large). Default: md |
| Badges | Yes | Array of badge items to display |
Badge Properties
| Property | Required | Description |
|---|---|---|
| Label | Yes | Text displayed on the badge |
| Colour | No | Badge colour: default, primary, success, warning, danger, or info |
Colour Meanings
Example: Feature Tags
Badges indicating feature status and availability.
Example: Technology Stack
Small badges listing technologies used.
Editing Badge Lists
| Action | How To |
|---|---|
| Set Size | Use the size selector for Small, Medium, or Large |
| Add Badge | Click Add Badge button for new entries |
| Edit Badge | Enter label text and select colour from dropdown |
| Remove Badge | Click the trash icon on individual badges |
| Preview | View the rendered badge row in live preview |