Ein System, fünf Gesichter: Wie weit das Theme trägt
Auf der Demos-Seite stehen inzwischen fünf Websites nebeneinander, die alle mit demselben CMF laufen: ein dunkler Produktauftritt mit Monospace-Akzenten, ein helles, sachliches Rechnungswerkzeug, ein nachtblauer Konzertplaner, ein Organisations-Pult mit Schreibschrift-Überschriften – und diese Seite hier. Dieselben Bausteine, dieselbe Ausgabe. Die Frage ist: Wie kommt so viel Unterschied aus so wenig?
Vierundzwanzig Stellschrauben
Das Theme ist kein Stylesheet, sondern eine Liste von Werten. Es gibt acht Farben – Hintergrund, Text, gedämpfter Text, Rahmen, Primär- und Sekundärfarbe, Textfarbe auf der Primärfarbe, Linkfarbe. Dazu fünf Schriftgrößen von Fließtext bis h5, zwei Schriftfamilien mit je einem Schriftschnitt für Text und Überschriften, drei Eckenradien und schließlich die Maße des Rasters: Containerbreite, Innenabstand, Spaltenabstand.
Das klingt nach wenig, ist aber genau die Menge, die ein Erscheinungsbild ausmacht. Ob eine Seite ruhig oder laut wirkt, entscheidet sich an drei Farben und einer Schrift – nicht an der Zahl der verfügbaren Optionen.
Wo das Theme aufhört
Alles, was über diese Werte hinausgeht, ist Custom-CSS: ein eigenes Feld, das als letztes geladen wird und deshalb alles überschreiben kann. Dort entstehen die Dinge, die eine Seite unverwechselbar machen – ein besonderer Hero-Bereich, eine eigene Kartenform, eine Animation.
Die Trennung ist der eigentliche Trick: Was im Theme steht, gilt überall und bleibt konsistent, auch wenn du es später änderst. Was im Custom-CSS steht, ist dein Sonderfall – und du weißt jederzeit, wo du nachsehen musst, wenn etwas anders aussieht als erwartet.
Ein Rat aus der Praxis
Fang mit den Farben an, nicht mit den Ausnahmen. Setze Hintergrund, Text und Primärfarbe, wähle eine Schrift für Überschriften – und sieh dir das Ergebnis auf einer echten Seite an, bevor du eine einzige Zeile Custom-CSS schreibst. In den meisten Fällen ist die Seite dann schon fertig, und der Rest ist Geschmacksfrage.
Die fünf Beispiele stehen unten auf der Demos-Seite. Warum das System bewusst wenig kann, steht im Beitrag Leichtbau: Was das CMF nicht hat – und warum das gut ist.