Product Logo

Theme wechseln

So wechselst du das visuelle Erscheinungsbild deiner easyWebsite zwischen den verfügbaren Themes.

Verfügbare Themes

ThemeBeschreibung
kernuxKERN-UX-Standard (Default)
bundBundes-Design mit Bundes Sans Schriftart
opencodeopenCode-Design mit Open Sans / Space Grotesk
opendeskopenDesk-Design (basiert auf openCode, lila Primärfarbe)

Easy Mode

Setze den --theme-Parameter in der .gitlab-ci.yml:

Committe die Änderung. Die nächste Pipeline baut die Webseite im neuen Theme.

Developer Mode

Im Developer Mode wird das Theme über den CSS-Import in deinem Projekt gesteuert. Jedes Theme bringt eigene CSS-Variablen, Farben und Schriftarten mit.

Ändere den CSS-Import in deiner Einstiegsdatei (z. B. _app.tsx oder globales Stylesheet):

Verwende nur einen der Imports. Jede Theme-Datei importiert das Basis-Stylesheet automatisch.

Eigene Anpassungen

Alle Themes verwenden CSS-Variablen, die du in deinem eigenen CSS überschreiben kannst:

Siehe CSS-Variablen für alle konfigurierbaren Optionen.

Konfigurator

Passe Farben, Eckenradius und Schriftgrößen live an — die gesamte Seite aktualisiert sich sofort. Sobald du zufrieden bist, kopiere den generierten CSS-Block und füge ihn in dein Projekt ein.