# Farben konfigurieren

In diesem Artikel erfährst du, wie du die Farben in deinem Shop konfigurierst.

Farben kannst du in verschiedenen Bereichen konfigurieren:

* Theme-Konfiguration
* Erlebniswelten
* jegliche HTML-Elemente (Inline-Styles)
* Shopware Core (sehr wenige, nicht für die Gestaltung relevant)

Nachfolgend zeigen wir dir wie du die Hauptfarben in der Theme-Konfiguration an deine Wünsche anpassen kannst, stellen dir das Farbkonfigurationsfeld vor und zeigen dir mögliche Konfigurationswerte.

## Beispiel

Wahrscheinlich möchtest du als erstes die Primärfarbe an dein Corporate-Design anpassen.

1. Öffne die Administration deines Shops
2. Wechsel über die Hauptnavigation in die "**Theme-Verwaltung**" (1) (2) ("Inhalte" => "Themes")
   * **Hinweis**: In der Shopware Cloud findest du den Bereich "Themes" direkt in der Hauptnavigation.
3. Klicke nun auf dein ThemeWare® Theme um die Bearbeitung zu beginnen
4. Wechsel in den Tab "**Layout**" (3)
5. Öffne den Bereich "**Hauptfarben**" (4)
6. Als "**Primärfarbe**" (5) wählen wir den Wert `#0e8ed3`
7. Im Feld Primärfarbe (hell) wählen wir die Nuance `#6ac5f5`
8. Als Primärfarbe (dunkel) wählen wir `#0c7ebb`
9. Speicher die Theme-Konfiguration
10. Wechsel in die Storefront und lade die Seite einmal neu

Du hast nun erfolgreich die Primärfarbe geändert.

#### Screenshots

![ThemeWare® Hauptfarben](/files/vQAhn04Zmc2t4Ae4P4Xw)

![TemeWare® Strong - Orange](/files/Su2eBfx8ZmR0VmeeJggc) ![ThemeWare® Strong - Blau](/files/rwewakG0pSirOduDiuBa)

{% hint style="info" %}
**Hinweis**: Die Farbe vom Logo oder Design-Elementen in Bannern der Erlebniswelt ändert sich dadurch nicht. Dies sind Grafiken die nicht vom Browser umgefärbt werden können. Du kannst aber alle Grafiken im PSD-Format über die ThemeWare® Utilities herunterladen und diese beliebig anpassen.
{% endhint %}

***

## Weiterführende Informationen

* Grundwissen: Mehr Informationen zum Thema "Farbkonfiguration" findest du im Artikel [Farbkonfiguration](/wissensdatenbank/grundwissen/farbkonfiguration.md).

#### ThemeWare® Video-Tutorial

{% embed url="<https://service.themeware.design/themeware-tutorial>" %}
ThemeWare® Video-Tutorial
{% endembed %}


---

# 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://wiki.themeware.design/wissensdatenbank/einfuehrung/farben-konfigurieren.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.
