> For the complete documentation index, see [llms.txt](https://wiki.themeware.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wiki.themeware.design/wissensdatenbank/einfuehrung/farben-konfigurieren.md).

# 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](https://2128686145-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTCpdN4monqL7jrjwbCZL%2Fuploads%2FoMjFMa9sBuUsSQPbr5io%2Ftutorial--farb-konfiguration.png?alt=media\&token=6f831057-54a6-489d-ad0a-8ebe6e69346f)

![TemeWare® Strong - Orange](https://2128686145-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTCpdN4monqL7jrjwbCZL%2Fuploads%2Fjl7g1xRw1U7kChhbMWSm%2Fimage.png?alt=media\&token=3638b9e7-1feb-42c0-b51e-39e5f4d6e524) ![ThemeWare® Strong - Blau](https://2128686145-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTCpdN4monqL7jrjwbCZL%2Fuploads%2FXXQSaDO2fHwAXQS6RFyQ%2Fimage.png?alt=media\&token=ff8cfc0f-21f9-479e-93c1-061905f41bb6)

{% 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 %}