Theme
Farben
Die Grundfarben der Website festlegen und eigene Farben ergänzen.
Unter Gestaltung → Theme → Farben legst du die Farbpalette der Website fest. Alle mitgelieferten Blöcke verwenden ausschließlich diese Farben. Die Farben erscheinen außerdem bei den Stilen Hintergrund, Button-Stil und Textfarbe.
Grundfarben
| Farbe | Wofür |
|---|---|
| Primär | Die Hauptfarbe der Marke: Buttons, Links, Hervorhebungen |
| Sekundär | Zweite Markenfarbe, z. B. für zweite Buttons oder Verläufe |
| Akzent | Kleine Hingucker, z. B. Badges |
| Hell / Dunkel | Helle und dunkle Hintergründe von Sektionen |
| Text | Die normale Schriftfarbe |
| Hintergrund | Der Seitenhintergrund |
| Fläche | Karten, Lightbox, Popups und Ausklapplisten |
| Abdeckung | Die halb durchsichtige Fläche hinter Lightbox und Popup |
| Rahmen und Linien | Rahmen, Trennlinien, Tabellenlinien |
| Erfolg / Warnung / Fehler | Hinweise und Rückmeldungen, z. B. in Formularen |
Farbe ändern
- Klicke in der Spalte Wert auf das Farbfeld und wähle die Farbe – oder tippe den Farbwert direkt ein (z. B. aus dem Styleguide).
- Prüfe die Spalte Kontrast (siehe Schrift auf Farbe und Kontrast).
- Sieh dir unten die Vorschau an. Sie zeigt die Farben schon vor dem Speichern.
- Klicke auf Speichern.
Abstufungen
Zu jeder Farbe erzeugt bloqy automatisch hellere und dunklere Abstufungen. Die Spalte Abstufungen zeigt sie als Farbleiste. Du musst nichts dafür tun – die Blöcke nutzen sie z. B. für helle Hintergründe („Primär hell“) oder dunklere Ränder.
Eigene Farben
Braucht die Website weitere Farben, etwa für einzelne Bereiche, klicke unter Eigene Farben auf Farbe hinzufügen. Gib eine Beschreibung (z. B. „Markenblau“), einen kurzen Namen in der Spalte Variable und den Farbwert an.

Damit Redakteure eine eigene Farbe zum Beispiel als Hintergrund auswählen können, braucht der Stil „Hintergrund“ einen weiteren Wert. Das richtest du unter Stile bearbeiten ein oder bittest deinen Administrator darum.

Vorschau
Ganz unten zeigt die Vorschau eine Überschrift, Fließtext mit Link, die drei Button-Arten, eine Karte, die Hinweise für Erfolg, Warnung und Fehler sowie die farbigen Flächen Primär, Sekundär, Akzent, Dunkel und Hell – jeweils mit Text und Buttons darauf. So prüfst du auf einen Blick, ob alles lesbar ist.

Warum eine Farbänderung überall wirkt, erklärt Variablen: Werte, die überall wirken.