> For the complete documentation index, see [llms.txt](https://docs.maker.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.maker.co/maker-greatstore/configure/appearance.md).

# Appearance

**Configure → Appearance.** Everything here changes what the shopper sees.

<figure><img src="/files/hyLg2Hq8m8zJ3hpICKKN" alt="Configure → Appearance"><figcaption><p>Configure → Appearance</p></figcaption></figure>

## Theme and colour

| Setting        | Notes                                                                               |
| -------------- | ----------------------------------------------------------------------------------- |
| Theme          | `AUTO`, `LIGHT`, `DARK`, or `CUSTOM`. Auto follows the shopper's system preference. |
| Brand colour   | Buttons, links and accents.                                                         |
| Surface colour | The chat background.                                                                |
| Text colour    | Body text. Borders and muted text are derived from it.                              |

{% hint style="info" %}
Because borders and muted text derive from the text colour, you usually only need the three colours rather than tuning every shade.
{% endhint %}

## Type and shape

| Setting        | Notes                                                |
| -------------- | ---------------------------------------------------- |
| Corner radius  | `SHARP`, `DEFAULT`, or `ROUNDED`.                    |
| Primary font   | A CSS `font-family`. Blank keeps the system default. |
| Secondary font | Blank reuses the primary font.                       |

## Layout

| Setting                  | Notes                                                                                                                              |
| ------------------------ | ---------------------------------------------------------------------------------------------------------------------------------- |
| Desktop panel side       | `LEFT` and `RIGHT` open a side panel. `MIDDLE` floats a compact input at the bottom of the screen, like mobile.                    |
| Mobile bottom bar        | `SHOW` keeps a persistent chat bar at the bottom on mobile.                                                                        |
| Stacking order (z-index) | How high the chat sits above your page. Lower it if a cookie banner or sticky header needs to stay on top. Blank uses the default. |

{% hint style="warning" %}
If the chat covers something important on your site — or is covered by it — the z-index is the setting to reach for before changing anything on your own page.
{% endhint %}

## AI disclaimer

A short line below the chat input reminding shoppers the assistant can be wrong. Toggle `SHOW` or `HIDE`, and override the wording if you need to. The text supports Markdown for links and bold, so you can point at your own AI policy.

## What the shopper sees

Every setting here is visible on the storefront once it saves — the panel position, its colours, the shape of its corners, and whether a disclaimer sits under the input.


---

# 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.maker.co/maker-greatstore/configure/appearance.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.
