> For the complete documentation index, see [llms.txt](https://lewe.gitbook.io/bootstrap-visuals-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/bootstrap-visuals-for-confluence/user-guide/button.md).

# Button

{% hint style="success" %}
Free Macro
{% endhint %}

## Screenshot

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

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

## Description

For the Button you can define different styles and sizes and and link it to a URL.

## Adding the Macro

Edit your page.

Select “+” => Other macros

Type in “Bootstrap” in the Search box

Select the “Bootstrap Button” macro

## Macro Options

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

### **Text**

Enter the text of the button.

### **Style**

Select one of the [Bootstrap color styles.](/bootstrap-visuals-for-confluence/user-guide/bootstrap-color-styles.md)

### **Size**

Select the size of the button.

### **Outline**

Check if you want to display the button with an outline only. This feature can only be applied to the flat buttons (not the 3D styles).

### **Link**

You can link the button to a URL. Enter it here and include http\:// or https\://.

### **Link Tooltip**

Since Version 1.3.0

This text will be shown as an HTML tooltip when you hover over a button that has a link.

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

### **Target**

Select where to load the linked page, in the same window or a new tab.

### **Custom Text Color**

You can overwriite the Bootstrap text color here that is defined by the style you selected. You can enter any hexadecimal color vlaue here, preceded by a hash, e.g. #990000.

### **Custom Background Color**

You can overwriite the Bootstrap background color here that is defined by the style you selected. You can enter any hexadecimal color vlaue here, preceded by a hash, e.g. #990000. However, this will not work with the 3D styles because they will create a default color gradient for your button.
