> For the complete documentation index, see [llms.txt](https://lewe.gitbook.io/html-and-aui-toolkit-for-confluence/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lewe.gitbook.io/html-and-aui-toolkit-for-confluence/aui-macros/aui-button.md).

# AUI Button

## Description

The AUI provides buttons as well. They are ideal to be used for more prominent links on your page.

The buttons are available in several variations:

| Sample                           | Button Style | Button Size | Icon | Comment                                                     |
| -------------------------------- | ------------ | ----------- | ---- | ----------------------------------------------------------- |
| ![](/files/N9jiRXjut2R1Qzy3KUCt) | Normal       | Normal      |      |                                                             |
| ![](/files/PVZLDnoIQiNgXnGJWFuu) | Normal       | Compact     |      |                                                             |
| ![](/files/6nvGzcPcC3CSNEfYyDXu) | Primary      | Normal      |      |                                                             |
| ![](/files/Yy2Zl76eQl1lpP2Vvsgd) | Primary      | Compact     |      |                                                             |
| ![](/files/XTS6WgXWVzQ6z5SEfpRo) | Subtle       | Normal      |      | In Confluence, the button shape shows on mouse-over.        |
| ![](/files/pD2OYyxK625gj3XxWKC6) | Subtle       | Compact     |      | In Confluence, the button shape shows on mouse-over.        |
| ![](/files/KaCa5JSJ1VCP4GK6FKBS) | Primary      | Normal      | like | Any of the above can be combined with one of the AUI icons. |

## Adding the Macro

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

## Macro Options

<figure><img src="/files/NPjhr3HqDPFVoZ2csUcu" alt=""><figcaption></figcaption></figure>

### **Title**

Enter the title of the button here.

### **Button Style**

Select the style of the button.

### **Button Size**

Select the size of the button here.

### **Button Link**

Enter the full URL here that the button shall link to.

### **Link Relation**

Select the link relation here or leave empty if not sure.

### **Link Target**

Select the link target here or leave empty if not sure.

### **Button Icon**

Check this switch if you want to use an icon in the button.

### **Icon**

Select the icon. This only has an effect if “Button Icon” is checked.