# Styles tab

{% tabs %}
{% tab title="Experience level" %}
This core reference entry is suited for **beginner-level builders.** 

[Learn more about experience levels.](#user-content-fn-1)[^1]
{% endtab %}

{% tab title="In-depth articles (4)" %}
To learn about this topic more in-depth, we recommend reading the suggested articles below:

**The styles tab**\
In this article we cover how to navigate the styles tab.

Article: [The styles tab](/help-guides/getting-started/navigating-the-bubble-editor/tabs-and-sections/styles-tab.md)

**Styling**\
In this article series, we cover how to design your app and use styles and style variables:

* Article series: [Styling](/help-guides/design/styling.md)
  * Article: [Font variables](/help-guides/design/styling/font-variables.md)
  * Article: [Color variables](/help-guides/design/styling/color-variables.md)
    {% endtab %}
    {% endtabs %}

The Styles Tab manages collections of visual and layout properties that are shared across elements in the app. Styles make it easy to maintain and modify a consistent visual identity.

Rather than setting the font, background, and border for each element, define a style and apply it to all the elements of a given type. 

## Style and font variables

<details>

<summary>Related articles</summary>

* Article: [Font variables](/help-guides/design/styling/font-variables.md)
* Article: [Color variables](/help-guides/design/styling/color-variables.md)

</details>

Bubble also includes pre-defined font and color variables in the Style variables sub tab to help make designing your application even faster. When the value of a Style variable is updated, any instance that uses the color variable will receive the new value automatically.

[^1]: In the Bubble docs, experience levels are categorized into beginner, intermediate, and advanced.

    To assist with learning, especially for more complex topics, we'll recommend prerequisite reading where it could be beneficial.&#x20;


---

# 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://manual.bubble.io/core-resources/bubbles-interface/styles-tab.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.