# Box

The Box component can be used as a background for several other components.

**Default Component Image:**

<div align="left"><img src="/files/c8DXFJT4fRTDXW2B3fZ3" alt=""></div>

### **Properties of the Box Component:**

**Background:** The user can enable shadow, change the shadow color of the chart, and adjust its transparency.

**General:** User can change the height, width, top, left. If initial visibility is unchecked, then the chart won’t be visible at the first preview. The user can type in the 'Click Value' to see something when they click it.

**Style**: The user can provide two colors in the Gradient section for the gradient rotation. Now, the selected two colors can be moved from top to bottom (initially, they could be moved only from left to right) if the user selects an angle of 90 degrees. It is possible for the user to change the opacity, border thickness-radius, and color.

### **Style Properties**

The user can configure the following Style Properties:

* Gradient Rotation
* Gradient: It prompts a menu with colors to choose from.
* Opacity: Set opacity for the component.
* Border Thickness: Set border thickness for the component.
* Border Radius: Set radius for the component border.
* Border Color: Select a color from the menu for the component border.
  * The modified Box appearance gets changed after changing its properties as displayed in the below-given image:

<div align="left"><img src="/files/68kIsBRWZUpZ1G8EQfv0" alt=""></div>

<div align="left"><img src="/files/DQasjkbgQdbog401fcI4" alt=""></div>


---

# 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.bdb.ai/bdb-documentation/data-visualization/governed-dashboards/charts-gallery/other-charts/box.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.