> ## Documentation Index
> Fetch the complete documentation index at: https://docs.xquiz.com.br/llms.txt
> Use this file to discover all available pages before exploring further.

# Container

<iframe className="aspect-video w-full rounded-xl" src="https://www.youtube.com/embed/jzgqpDN4NIE" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />

The Container element serves as a visual separator to better organize and structure your page layout. It doesn't allow you to include elements inside it, but works as a support block to highlight or separate parts of your communication.

**What it's for**

* Create visual divisions on the page.

* Separate sections to improve reading and design.

* Highlight sections with background, borders, or differentiated spacing.

**What you can configure**

**Borders:**

* Show: activates or deactivates the border around the container.

* Style: border line type (solid, dashed, etc.).

* Width: border thickness.

* Radius: corner rounding.

* Color: border color.

**Background:**

* Show: activates or deactivates the container background area.

* Padding: defines internal spacing.

* Shadow: applies shadow to give depth.

* Color: defines background color.

**General Settings:**

* Spacing: defines external margin between this block and others.

* Animation: chooses an entry effect for the container.

* Alignment: defines container alignment.

* Size: controls container length.

**Usage tip!**

Use containers to better structure the page, separate important parts of content, or create "visual breathing spaces". Even without containing other elements inside, it helps a lot with aesthetics and organization.
