# Theme-Farben

### Übersicht

Die Farben, die du hier hinterlegst spiegeln sich an unterschiedlichen Stellen deines Shops wider.

### Konfiguration

<figure><img src="/files/rIzn7TDffoASydt7XpNa" alt=""><figcaption></figcaption></figure>

<details>

<summary>Primärfarbe</summary>

Dies ist die Hauptfarbe deines Shops. Sie zieht zieht sich wie ein roter Faden durch alle Unterseiten und färbt verschiedene Elemente in den hier hinterlegten Wert. Ganz konkret sind dies bspw. die [Buttons](/academy/fachbegriffe/button.md), die [Top Bar](/academy/fachbegriffe/top-bar.md) oder auch die [Ankündigungsleiste](/academy/fachbegriffe/ankundigungsleiste.md).

***

[Variable:](/academy/fachbegriffe/variable.md) `$sw-color-brand-primary`

</details>

<details>

<summary>Sekundärfarbe</summary>

Die Sekundärfarbe dient als Akzentfarbe und tritt an vereinzelten Stellen in deinem Online Shop auf. Ein Beispiel hierfür ist der [Button](/academy/fachbegriffe/button.md) des Gutschein-Einlösefeldes im [Offcanvas](/academy/fachbegriffe/offcanvas.md)-Warenkorb.

***

[Variable:](/academy/fachbegriffe/variable.md) `$sw-color-brand-secondary`

</details>

<details>

<summary>Rahmen</summary>

Wie der Name schon verrät ist diese Farbkonfiguration für die Rahmen in deinem Online Shop verantwortlich. Diese kannst du bspw. an der Trennlinie auf der [Produkt Detailseite](/academy/fachbegriffe/produkt-detailseite.md) oder im [Warenkorb](/academy/fachbegriffe/warenkorb.md) sehen.

***

[Variable:](/academy/fachbegriffe/variable.md) `$sw-border-color`

</details>

<details>

<summary>Hintergrund</summary>

Dies ist die Hintergrundfarbe deines Shops auf allen Seiten. Wir empfehlen diesen komplett weiß oder in einem leichten hellgrau zu halten. Andernfalls kann es schnell passieren, dass der Hintergrund zu stark ablenkt.

***

[Variable:](/academy/fachbegriffe/variable.md) `$sw-background-color`

</details>

<details>

<summary>Browser-Farbe</summary>

Mit dieser Einstellung lässt sich die mobile Browser-Farbe anpassen. Jedoch unterstützt nicht jeder Browser dieses Feature. Daher kann unter Umständen in manchen Browsern immer noch eine Standard-Systemfarbe dargestellt werden.

<figure><img src="/files/wWbuPNG3rACUzlRWbFjV" alt=""><figcaption></figcaption></figure>

</details>


---

# 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.atloss.de/theme-konfiguration/allgemein/theme-farben.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.