> For the complete documentation index, see [llms.txt](https://docs.appmysite.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.appmysite.com/app/design/theme/color-scheme.md).

# Color scheme

### How to set the color scheme of your app?

You can define how your app looks by setting a custom color scheme. This controls the colors used in the header, footer, buttons, icons, and other interactive elements.

{% embed url="<https://scribehow.com/shared/Color_Scheme__1DXt-8zBScGsEJHKMPmpZQ>" %}

**Step 1: Open the color scheme settings**

* Go to the [**Theme screen**](https://app.appmysite.com/app/theme) from the Design section in the side menu
* Click on the Color scheme button at the top of the screen

**Step 2: Choose how to configure colors**

* "Your app colors" option lets you manually select and apply your own brand colors
* "Preset colors" option provides a set of ready-made combinations you can instantly use
* "Get my website’s colors" option allows you to extract and apply colors from your connected website

{% hint style="warning" %}
Click "Retry" to fetch a new set of colors from your website using the "Get my website’s colors" feature.
{% endhint %}

**Step 3: Set each color in your palette**

* Base color defines the main color used across the header, bottom bar, and background elements
* Contrast color is used for text and icons that appear on top of the base-colored areas
* Selection color is applied to selected items like tabs, active icons, and highlights
* Highlight color is used for call-to-action buttons and other accent elements between the header and footer

**Step 4: Save or reset your selection**

* Click Done to save your selected colors
* Click "Reset" to revert all changes
* Click Cancel to discard changes and exit

{% hint style="success" %}
Preview the design on the demo app or the [**Preview emulator.** ](/app/preview.md)
{% endhint %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://docs.appmysite.com/app/design/theme/color-scheme.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.
