Eigene Farben¶
Passt keine der Paletten zu Ihrem Erscheinungsbild, ändern Sie einzelne Farben. Am besten wählen Sie zuerst die Palette, die am nächsten liegt, und passen dann eine oder zwei Farben an.
Farben ändern¶
- Design → Editor → Stile → Farben öffnen.
- Palette bearbeiten wählen.
- Unter Theme auf eine Farbe klicken und im Farbwähler den neuen Wert wählen oder als Hex-Wert eintragen.
- Oben auf Speichern klicken.
Die Farben der Palette¶
| Farbe | Wofür Ahoi sie nutzt |
|---|---|
| Grund | Hintergrund der Seite |
| Kontrast | Text |
| Primär | Links, Buttons |
| Akzent | kleine Zeilen über Überschriften, Striche, Etiketten, das Aufforderungsband |
| Akzent, hell | Akzent auf dem dunklen Band im Footer |
| Fläche | getönte Abschnitte, Bildplätze in den Vorlagen |
| Gedämpft | Nebentexte wie Datum und Untertitel |
| Linie | Trennlinien |
| Dunkles Band | Hintergrund des Footers |
| Auf dunklem Band | Text im Footer |
| Gedämpft auf dunklem Band | Nebentexte im Footer |
| Primär (dunkel), Akzent (dunkel), Gedämpft (dunkel) | die dunklen Werte von Primär, Akzent und Gedämpft, siehe unten |
Was im dunklen Modus passiert¶
Die Farben der Paletten haben jeweils einen hellen und einen dunklen Wert. Wählen Sie eine Farbe selbst, speichert WordPress nur einen Wert. Ahoi behandelt ihn so:
- Primär, Akzent, Gedämpft: Ihre Farbe gilt hell. Für dunkel leitet Ahoi aus ihr einen helleren Ton ab, der auf dem dunklen Grund gut lesbar ist.
- Alle anderen Farben (Grund, Kontrast, Fläche, Linie, das Band): Ihre Farbe gilt hell, dunkel bleibt der Wert der Palette.
Den dunklen Ton selbst wählen¶
Gefällt Ihnen der abgeleitete Ton nicht, ändern Sie das passende Feld Primär (dunkel), Akzent (dunkel) oder Gedämpft (dunkel). Ihr Wert gilt dann im dunklen Modus so, wie Sie ihn gewählt haben. Ahoi passt ihn nicht an, auch wenn der Kontrast nicht reicht.
Zurück zum abgeleiteten Ton¶
Unter Palette bearbeiten neben Theme das Menü Farboptionen öffnen und Farben zurücksetzen wählen. Das setzt die ganze Palette zurück, also auch Ihre hellen Farben. Danach wählen Sie Ihre hellen Farben neu; die dunklen leitet Ahoi wieder selbst ab.
Ein Feld „(dunkel)“, das genau auf dem Wert der Palette steht, behandelt Ahoi wie ein unverändertes Feld und leitet ab.
Kontrast prüfen¶
Ahoi übernimmt Ihre hellen Farben unverändert, auch wenn Text dann schlecht lesbar ist. Prüfen Sie deshalb jede eigene Farbe:
- Text und Links brauchen mindestens 4,5 : 1 zum Hintergrund, große Überschriften 3 : 1.
- Feldränder und Bedienelemente brauchen 3 : 1.
Geeignet ist jeder Kontrastrechner, etwa der in den Entwicklerwerkzeugen des Browsers. Prüfen Sie hell und dunkel: Für die dunkle Seite schalten Sie im Website-Editor unter Stile die dunkle Vorschau ein (Button mit dem Mondsymbol) oder im Frontend den Umschalter im Header.
Gut zu wissen¶
- Der Farbwähler zeigt
#000000. Öffnen Sie eine Farbe der Palette, zeigt der Farbwähler von WordPress zunächst Schwarz statt der Farbe. Das liegt am Editor: Er kann die Farbangaben mit hellem und dunklem Wert nicht lesen. Die Farbe selbst ist richtig, wie das Farbfeld in der Liste zeigt. - Eigene Farben an einzelnen Blöcken wechseln nicht zwischen hell und dunkel, siehe Hell und dunkel.
- Die Felder „(dunkel)“ in der Farbauswahl der Blöcke. Wählen Sie bei einem Block eine Text- oder Hintergrundfarbe, stehen dort auch „Primär (dunkel)“, „Akzent (dunkel)“ und „Gedämpft (dunkel)“. Sie sind für den dunklen Modus gedacht und auf hellem Grund zu blass. Nehmen Sie für Blöcke die Farben ohne „(dunkel)“; sie wechseln von selbst mit.