So aktualisierst du Markenfarben in Shopify (2026)

Die wichtigsten Erkenntnisse

• Die Markenfarben befinden sich im Theme-Editor unter Theme-Einstellungen → Farben. Änderungen hier gelten global für deinen gesamten Shop.
• Moderne Shopify-Themes (Dawn, Horizon) verwenden Farbschemata – benannte Paletten, die du für mehr Flexibilität pro Abschnitt zuweisen kannst.
• Für Farben, die dein Theme nicht in den Einstellungen anbietet, sind CSS Custom Properties oder eine direkte Code-Anpassung erforderlich.
• Fudge kann eine benutzerdefinierte Farbpalette auf dein gesamtes Theme anwenden, ohne dass du CSS schreiben musst.

Um die Markenfarben in Shopify zu aktualisieren, gehe zu Onlineshop → Themes → Anpassen → Theme-Einstellungen → Farben und gib deine Hex-Codes ein. In Dawn, Horizon und anderen modernen Themes bearbeitest du dort Farbschemata und weist jedem Abschnitt eines zu.

Warum du uns vertrauen kannst

Jacques hat über 15 Jahre Erfahrung in der Shopify-Entwicklung. Wir bauen Fudge, den KI-Operator für Shopify-Shops, mit einer 4.9-Bewertung im Shopify App Store.

Wo du Markenfarben in Shopify aktualisieren kannst

Schritt 1. Gehe zu Onlineshop → Themes → Anpassen.

Schritt 2. Scrolle in der linken Seitenleiste nach unten und klicke auf Theme-Einstellungen.

Schritt 3. Klicke auf Farben (einige Themes nennen diesen Bereich “Farbschemata” oder “Palette”).

Schritt 4. Du siehst Color Picker (Farbauswähler) für Elemente wie:

• Hintergrundfarbe (Background color)
• Textfarbe (Text color)
• Button-Farbe und Button-Textfarbe
• Rahmenfarbe (Border color)
• Linkfarbe (Link color)
• Sale-Badge-Farbe

Schritt 5. Klicke auf ein Farbfeld, um den Color Picker zu öffnen. Gib direkt einen Hex-Code ein (z. B. #E63946) oder nutze den Picker, um eine Farbe visuell auszuwählen.

Schritt 6. Speichere, wenn du fertig bist. Änderungen gelten sofort für alle Seiten.

Wie ändere ich Markenfarben bei Shopify?

Gib deine genauen Marken-Hex-Codes in die Farbauswahlfelder ein. Der Color-Picker von Shopify akzeptiert:

• Hex-Codes - #FF5733
• RGB-Werte - rgb(255, 87, 51)
• HSL-Werte - über den visuellen Slider

Verwende Hex-Codes für genaue Ergebnisse. Deine Markenrichtlinien sollten die genauen Hex-Werte für Primär-, Sekundär- und Akzentfarben vorgeben.

Informationen zu Schriftarten und Farben findest du unter So aktualisierst du Farben und Schriftarten in Shopify.

Wie Farbschemata in modernen Shopify-Themes funktionieren

Themes wie Dawn und Horizon nutzen ein Farbschema-System (color scheme system) anstelle von einzelnen globalen Farbwerten.

Ein Farbschema ist ein benanntes Set aus Hintergrund-, Text- und Button-Farben – zum Beispiel: „Schema 1 = weißer Hintergrund mit dunklem Text“, „Schema 2 = dunkler Hintergrund mit hellem Text“.

Jedem Abschnitt kann ein anderes Farbschema zugewiesen werden. Dadurch kannst du das visuelle Gewicht auf der Seite abwechseln, ohne Farben einzeln festlegen zu müssen.

So bearbeitest du ein Farbschema: Theme-Einstellungen → Farbschemata → klicke auf das Schema, das du bearbeiten willst → aktualisiere die Farbwerte.

So weist du einem Abschnitt ein Schema zu: Klicke auf den Abschnitt im Theme Editor → suche in seinen Einstellungen nach dem Dropdown Farbschema.

So überschreibst du Farben mit CSS

Wenn eine Farbe nicht in den Theme-Einstellungen angeboten wird – wie z. B. eine bestimmte Icon-Farbe, ein Hover-State oder ein Element einer Drittanbieter-App – kannst du sie mit Custom CSS überschreiben.

Gehe zu Theme-Einstellungen → scrolle zu Benutzerdefiniertes CSS (Custom CSS) → füge deinen Override hinzu:

.your-element-class {
    color: #e63946;
    background-color: #ffffff;
}

Um die richtige CSS-Klasse zu finden: Klicke mit der rechten Maustaste auf das Element in deinem Live-Shop → Untersuchen (Inspect) → überprüfe die Klassenattribute des Elements.

Speziell für Linkfarben siehe So änderst du die Linkfarbe in Shopify.

So wendest du mit Fudge eine komplette Marken-Farbpalette an

Wenn du ein Rebranding machst und eine neue Farbpalette konsistent auf Buttons, Überschriften, Banner, Badges und Hover-States anwenden möchtest – und nicht nur auf die Farben, die dein Theme in den Einstellungen freigibt –, beschreibe sie Fudge, dem KI-Operator für Shopify-Shops:

„Aktualisiere den Shop, um unsere Markenfarben zu verwenden: Primär #1A1A2E, Akzent #E63946, Hintergrund #FAFAFA und Button-Text weiß. Wende das Ganze konsistent auf Buttons, Links und Abschnittshintergründe an.“

Der Store Editor von Fudge generiert die Änderungen als Entwurf, sodass du die neue Palette auf echten Seiten überprüfen kannst, bevor etwas live geht. Die Farben befinden sich im eigenen CSS deines Themes, sodass sie erhalten bleiben, falls du Fudge jemals deinstallierst.

Tipps zur Auswahl deiner Shopify-Markenfarben

• Halte es einfach. Zwei bis drei zentrale Markenfarben reichen aus. Eine Primärfarbe für CTAs und Überschriften, eine Sekundärfarbe für Akzente und ein neutraler Ton für Hintergründe.
• Überprüfe den Kontrast. Text benötigt für die Lesbarkeit und Barrierefreiheit einen ausreichenden Kontrast zum Hintergrund. Nutze ein Tool wie den WebAIM Contrast Checker zur Überprüfung.
• Teste in der mobilen Vorschau. Farbentscheidungen, die auf einem breiten Desktop-Layout ausgewogen wirken, können auf einem kleinen Smartphone-Bildschirm schnell überladen wirken. Überprüfe immer beides.

FAQ