> 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/badge.md).

# Badge

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

## Screenshot

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

## Description

The Badge looks much like a lozenge. You can define different styles and sizes and also combine it with a Heading or a Bootstrap button.

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

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

## Adding the Macro

Edit your page.

Select “+” => Other macros

Type in “Bootstrap” in the Search box

Select the “Bootstrap Badge” macro

## Macro Options

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

### **Text**

Enter the text of the badge.

### **Style**

Select one of the [Bootstrap color styles](https://support.lewe.com/docs/bootstrap-visuals-for-confluence-manual/user-guide/bootstrap-color-styles/).

### **Type**

Select “Badge” or “Pill”. The pill will have more rounded corners.

### **Size**

Enter the size of the badge in percent. The default size is 75%.

### **Display as**

Select whether to make the Badge part of a Heading or a Bootstrap Button.

{% hint style="warning" %}
If you select a Heading and also use a plugin or macro that reads out the headings of your page, this heading will be included!
{% endhint %}

### **Button/Header Text**

If part of a Heading or Button, enter the prefix text here.

### **Upper Right Corner**

*<mark style="background-color:orange;">Only available in Badge 5</mark>*

With this option enabled, the badge will be shown in the upper right corner of the button. Only has an effect when displayed as a button.

### **Button style**

If part of a Button, select the button style here.

### **Button link**

If part of a Button, you can link the button to a URL. Enter it here and include http\:// or https\://.

### **Target**

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

### **Custom Text Color**

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

### **Custom Background Color**

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


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://lewe.gitbook.io/bootstrap-visuals-for-confluence/user-guide/badge.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.