So aktualisieren Sie die Markenfarben in Shopify (2026)

Das Wichtigste in Kürze

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

Egal, ob du deiner Marke einen neuen Look verpasst oder zum ersten Mal online gehst, die Aktualisierung der Farben in Shopify ist größtenteils eine No-Code-Aufgabe. Hier erfährst du, wo du die Einstellungen findest und wie du sie optimal nutzt.

Warum Sie uns vertrauen können

Jacques hat über 15 Jahre Erfahrung in der Shopify-Entwicklung. Wir haben Fudge entwickelt – einen KI-Storefront-Editor, der von Hunderten von Shopify-Shops genutzt wird und eine Bewertung von 4.9 im Shopify App Store hat.

Wo man Markenfarben in Shopify aktualisiert

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 Farbwähler für Elemente wie:

• Hintergrundfarbe
• Textfarbe
• Button-Farbe und Button-Textfarbe
• Rahmenfarbe
• Link-Farbe
• Sale-Badge-Farbe

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

Schritt 6. Speichere, wenn du fertig bist. Die Änderungen werden sofort auf allen Seiten übernommen.

Wie ändere ich die Markenfarben bei Shopify?

Gib die genauen Hex-Codes deiner Marke in die Farbwähler-Felder ein. Der Farbwähler von Shopify akzeptiert:

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

Verwende Hex-Codes für mehr Genauigkeit. Deine Markenrichtlinien sollten die exakten Hex-Werte für Primär-, Sekundär- und Akzentfarben vorgeben.

Siehe auch: Farben und Schriftarten in Shopify aktualisieren.

Wie Farbschemata in modernen Shopify-Themes funktionieren

Themes wie Dawn und Horizon verwenden ein Farbschema-System anstelle einzelner globaler Farbwerte.

Ein Farbschema ist ein benanntes Set aus Hintergrund-, Text- und Buttonfarben – 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. So können Sie die visuelle Gewichtung auf der Seite variieren, ohne Farben einzeln einstellen zu müssen.

So bearbeiten Sie ein Farbschema: Theme-Einstellungen → Farbschemata → Klicken Sie auf das Schema, das Sie bearbeiten möchten → Aktualisieren Sie die Farbwerte.

So weisen Sie einem Abschnitt ein Schema zu: Klicken Sie im Theme-Editor auf den Abschnitt → Suchen Sie in den Einstellungen nach dem Dropdown-Menü Farbschema.

Verwandt: Fudge Store Editor.

Wo navigiert man in Shopify hin, um die Markenfarben zu aktualisieren?

Der vollständige Pfad lautet: Onlineshop → Themes → Anpassen → Theme-Einstellungen → Farben.

Einige Themes bieten auch Farbeinstellungen auf Abschnittsebene an. Klicken Sie auf einen beliebigen Abschnitt → Suchen Sie im Einstellungsbereich nach einer Option für „Farbschema“ oder „Hintergrundfarbe“. Farben auf Abschnittsebene überschreiben die globalen Standardeinstellungen nur für diesen spezifischen Abschnitt.

So überschreiben Sie Farben mit CSS (Code Overrides)

Wenn eine Farbe nicht in den Theme-Einstellungen verfügbar ist – 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 den Theme-Einstellungen → scrolle zu Custom CSS → füge deinen CSS-Code hinzu:

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

Um die richtige CSS-Klasse zu finden: Mache einen Rechtsklick auf das Element in deinem Live-Shop → Untersuchen (Inspect) → überprüfe die Klassenattribute des Elements.

Siehe auch: Link-Farbe in Shopify ändern.

So wenden Sie mit Fudge eine komplette Marken-Farbpalette an

Wenn Sie ein Rebranding durchführen und eine neue Farbpalette konsistent auf Buttons, Überschriften, Banner, Badges und Hover-Zustände anwenden möchten – und nicht nur auf die Farben, die Ihr Theme in den Einstellungen anbietet – beschreiben Sie dies Fudge:

„Aktualisiere den Store auf unsere Markenfarben: Primärfarbe #1A1A2E, Akzentfarbe #E63946, Hintergrund #FAFAFA und Button-Text weiß. Wende dies konsistent auf Buttons, Links und Abschnittshintergründe an.“

Fudge erstellt die Änderungen als Entwurf. Sie prüfen alles, bevor es live geht.

Verwandt: Change Font Color in Shopify.

Tipps zur Auswahl der Shopify-Markenfarben

• Halte es simpel. Zwei bis drei Kernfarben für die Marke sind genug. Eine Primärfarbe für CTAs und Überschriften, eine Sekundärfarbe für Akzente und ein neutraler Ton für Hintergründe.
• Prüfe den Kontrast. Text benötigt einen ausreichenden Kontrast zu seinem Hintergrund für Lesbarkeit und Barrierefreiheit. 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