# AUI Badge

## Description

The AUI badges are small but effective visualizations of numbers. They look a little like lozenges but have a smoother radius around the corners. They are best used for numbers only. For status or small text labels, use the .

The AUI Badge comes in two flavors:

| Type    | Example                                                                                                                                                                                                                                |
| ------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Default | ![](https://3884669180-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fs1Vtfb5fcOs06GOHo0WA%2Fuploads%2F1xSdubvUFRmRjv8xJhOg%2Fimage2018-12-10_22-48-56.png?alt=media\&token=39c94f90-9344-4201-a8c9-4745d53d5a88) |
| Primary | ![](https://3884669180-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fs1Vtfb5fcOs06GOHo0WA%2Fuploads%2FBuIS3wqtkDetfNWthh5n%2Fimage2018-12-10_22-49-57.png?alt=media\&token=3a7adc7e-09a0-42fa-8925-a54f2f00fa8a) |

## Adding the Macro

1. Edit your page.
2. Select “+” => Other macros
3. Type in “aui” in the Search box
4. Select the “AUI Badge” macro

## Macro Options

<figure><img src="https://3884669180-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fs1Vtfb5fcOs06GOHo0WA%2Fuploads%2FCsZyf7RrTx42HMlibazV%2Fimage2018-12-10_23-6-45.png?alt=media&#x26;token=6a5f1201-a3c0-4023-9af9-9971e49ff4f2" alt=""><figcaption></figcaption></figure>

### **Text**

Enter the text of the badge.

### **Primary**

Select the primary style of the badge here. It will be colored light blue.