> For the complete documentation index, see [llms.txt](https://docs.bdb.ai/bdb-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.bdb.ai/bdb-documentation/data-visualization/governed-dashboards/charts-gallery/common-chart-properties/background.md).

# Background

{% hint style="success" %}
*Check out the given walk-through on how to apply the Background properties on the Designer charts.*&#x20;
{% endhint %}

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

You can insert various background properties and change the display of the chart or various charts in a dashboard.

Once you have associated a data connection with a charting component, you can select the Properties icon to open the chart related properties. To know how to create a Data Connection refer the [*<mark style="color:blue;">**Establishing a Data Connection**</mark>*](/bdb-documentation/data-visualization/governed-dashboards/connecting-to-a-data-source/establishing-a-data-connection.md) section.

The following image displays the default ***Background*** Properties that open for the Column chart:

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

The default data preview for the column chart:

![](/files/HZUXNBdPP3FVaFQ0pa2I)

If we modify the ***Background*** properties in the following way:

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

The data preview with the column chart with the applied background properties appears as shown below:

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

Click the ***Maximise*** icon <img src="/files/4dy4i8v70MtfHzlUi8Uj" alt="" data-size="line"> to display the data preview in the full screen.

<figure><img src="/files/6uY58XJdv3dzNxOCVtdp" alt=""><figcaption></figcaption></figure>

The user can add multiple Gradient colors by clicking the Gradient icon <img src="/files/EWHxCyzIhOm6g15CMDAZ" alt="" data-size="line">from the ***Background*** properties panel.

* Click the ***Gradient*** icon.

&#x20;     ![](/files/vEtDK7K2KLAU1IOiGzpR)

* The ***Background*** gradient colors window opens.
* Click the ***Add Color*** option.
* A new color gets added for the gradient.
* You may change the added color by using the available color pallet.
* Click the ***Save*** option to save the added colors for the background gradient.
