# Legend

The **Legend** settings in the Styles tab allow users to configure how the chart legend appears, including its position, size, text style, and interactivity. The legend helps users understand the chart by providing labels and visual indicators for data series.

#### Accessing the Legend Settings

To access the **Legend** settings:

1. Open the **Advanced Editor** by clicking on the **Styles** tab.
2. Select **Legend** from the list of style options.

<figure><img src="/files/xANmw3QuCNe9ewVIZ2RY" alt="" width="157"><figcaption></figcaption></figure>

***

#### Legend Settings Overview

| Feature              | Description                                                                                                                                                               |
| -------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Show Legend**      | Toggle the visibility of the legend. Enabling it displays a legend on the chart.                                                                                          |
| **Type**             | <p>Choose between <strong>Plain</strong> (static list) or <strong>Scroll</strong> (allows scrolling through items).<br><img src="/files/LyKyFfrsHo4nf8IZ09bw" alt=""></p> |
| **Background Color** | Set a custom background color for the legend.                                                                                                                             |
| **Icon Type**        | Choose the icon style representing the series in the legend. Options include **auto** (default), line, bar, and more.                                                     |
| **Width & Height**   | Define the dimensions of the legend. Leaving it as **undefined** makes it adjust dynamically.                                                                             |
| **Padding**          | Adjust the spacing around the legend.                                                                                                                                     |

***

#### **Position Settings**

The **Position** section allows you to adjust the legend's placement.

<figure><img src="/files/drksRro8fa3XVNlhGTHP" alt="" width="154"><figcaption></figcaption></figure>

| Setting                      | Description                                                                               |
| ---------------------------- | ----------------------------------------------------------------------------------------- |
| **Top, Bottom, Left, Right** | Set exact positions in pixels or leave as **auto** to let the system determine placement. |

***

#### **Item Settings**

The **Item** section lets you customize the individual legend items.

<figure><img src="/files/a72kNXmDEByofelxuaw7" alt="" width="153"><figcaption></figcaption></figure>

| Setting         | Description                           |
| --------------- | ------------------------------------- |
| **Item Gap**    | Adjusts spacing between legend items. |
| **Item Width**  | Defines the width of each item.       |
| **Item Height** | Defines the height of each item.      |

***

#### **Text Settings**

The **Text** section allows users to style the legend labels.

<figure><img src="/files/R6IA5ArQ0fCQo7lOnaBG" alt="" width="152"><figcaption></figcaption></figure>

| Setting            | Description                                                     |
| ------------------ | --------------------------------------------------------------- |
| **Font**           | Choose the font family for the legend text.                     |
| **Size**           | Adjust the font size.                                           |
| **Bold / Italic**  | Enable bold or italic styling.                                  |
| **Color**          | Set the text color.                                             |
| **Background**     | Define a background color for the legend text.                  |
| **Width & Height** | Adjust the dimensions of the text box.                          |
| **Text Padding**   | Modify the space around text within the legend.                 |
| **Overflow**       | Set how text overflow should be handled (e.g., clip, ellipsis). |

***

By customizing these settings, users can ensure that the legend is clear, readable, and aligns well with their chart layout.


---

# Agent Instructions: 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:

```
GET https://docs.getinfinity.app/user-guide/comprehensive-user-guide/2.-charts/chart-customization/customizing-chart-with-advanced-editor-panel/styles/legend.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.
