> ## Documentation Index
> Fetch the complete documentation index at: https://docs.scanova.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Themes

> Ein Theme mit 21 voreingestellten Stilen auswählen und mit vollständigen Token-Überschreibungen anpassen.

## Was ein Theme steuert

Ein Theme steuert den gesamten visuellen Stil einer Landingpage: Hintergrundfarbe, Oberflächenfarbe, Textfarbe, Akzentfarbe, Schriftart, Eckenradius sowie Schatten-/Oberflächenstil. Ein Themewechsel aktualisiert sofort jeden Block auf der Seite – Themes ändern nie Ihre Inhalte, nur deren Erscheinungsbild.

## Die Theme-Auswahl öffnen

Klicken Sie im Header des Page-Builders auf die Schaltfläche **Theme**. Die Theme-Auswahl öffnet sich im rechten Panel und zeigt voreingestellte Themes (Tab **Voreinstellungen**) sowie alle von Ihnen gespeicherten Themes (Tab **Gespeichert**).

## Voreingestellte Themes

Die Auswahl bietet **21 voreingestellte Themes**, verteilt auf zwei Seiten mit 12 und 9 Karten.

<Frame caption="Voreingestellte Themes, Seite 1 von 2 – Modern, Classic, Midnight, Emerald, Aqua, Sharp, Pill, Flat, Navy, Sage, Noir, Coral Pop">
  <img src="https://mintcdn.com/scanova-api/q8t3kzcRTgAP7jV0/images/v2/page-builder/themes/preset-themes-page1.png?fit=max&auto=format&n=q8t3kzcRTgAP7jV0&q=85&s=c4d5f9eee75f3ce0e2f6e093e78e9c69" alt="Tab „Voreinstellungen“ der Theme-Auswahl, Seite 1, mit 12 Karten voreingestellter Themes mit Farbmustern und Namen" width="1440" height="1200" data-path="images/v2/page-builder/themes/preset-themes-page1.png" />
</Frame>

<Frame caption="Voreingestellte Themes, Seite 2 von 2 – Terracotta Craft, Cobalt Tech, Blush Romance, Charcoal Editorial, Mint Festive, Aurora Pulse, Prism Glass, Frosted, Legacy">
  <img src="https://mintcdn.com/scanova-api/q8t3kzcRTgAP7jV0/images/v2/page-builder/themes/preset-themes-page2.png?fit=max&auto=format&n=q8t3kzcRTgAP7jV0&q=85&s=07671aab459b8ca50e4d0f32a5c139d8" alt="Tab „Voreinstellungen“ der Theme-Auswahl, Seite 2, mit den verbleibenden 9 Karten voreingestellter Themes mit Farbmustern und Namen" width="1440" height="1200" data-path="images/v2/page-builder/themes/preset-themes-page2.png" />
</Frame>

| Seite | Voreingestellte Themes                                                                                                     |
| ----- | -------------------------------------------------------------------------------------------------------------------------- |
| 1     | Modern, Classic, Midnight, Emerald, Aqua, Sharp, Pill, Flat, Navy, Sage, Noir, Coral Pop                                   |
| 2     | Terracotta Craft, Cobalt Tech, Blush Romance, Charcoal Editorial, Mint Festive, Aurora Pulse, Prism Glass, Frosted, Legacy |

<Warning>
  Ältere Dokumentation beschrieb „zehn voreingestellte Themes“ und nannte darunter **Royal, Retro, Sunset** und **Mono Dark**. Keines dieser vier existiert in der aktuellen Auswahl – der Katalog ist inzwischen auf 21 Voreinstellungen gewachsen, von denen sechs (Modern, Classic, Midnight, Emerald, Navy, Aqua) aus den ursprünglichen zehn übernommen wurden.
</Warning>

Klicken Sie auf eine Theme-Karte, um sie anzuwenden. Die Canvas aktualisiert sich sofort, sodass Sie Themes vergleichen können, ohne den Editor zu verlassen.

## Theme-Überschreibungen

Nach der Auswahl einer Voreinstellung klicken Sie auf **Anpassen** auf ihrer Karte, um ein Panel zu öffnen, in dem Sie beliebige Design-Tokens des Themes unabhängig überschreiben können, ohne die Basisvoreinstellung zu ändern. Das Panel ist in sieben Abschnitte gegliedert, in dieser Reihenfolge:

<Frame caption="Die sieben einklappbaren Abschnitte des Anpassen-Panels">
  <img src="https://mintcdn.com/scanova-api/q8t3kzcRTgAP7jV0/images/v2/page-builder/themes/customise-panel-sections.png?fit=max&auto=format&n=q8t3kzcRTgAP7jV0&q=85&s=d257440b7605620bfccb2f54c83a6c68" alt="Anpassen-Panel mit sieben einklappbaren Abschnitten: Farbe, Hintergrund, Typografie, Form, Oberfläche, Effekte, Abstand" width="1440" height="1200" data-path="images/v2/page-builder/themes/customise-panel-sections.png" />
</Frame>

### Farbe

Überschreiben Sie die Farb-Tokens des Themes einzeln: Hintergrund, Oberfläche, Oberfläche alt, Akzent, Button-Text (Akzent-Vordergrund), Überschrift, Fließtext, Gedämpft und Rahmen. Jedes Feld fällt bei Leerlassen auf den Wert der Voreinstellung zurück.

### Hintergrund

Wählen Sie, wie der Seitenhintergrund dargestellt wird – eine einfarbige Farbe, ein Farbverlauf (Winkel und Farbstopps), ein Bild (mit Anpassungs- und Deckkraft-Steuerelementen) oder ein Video (mit Deckkraft-Steuerelement) – sowie einen Hintergrundeffekt (siehe [Animierte Effekte](/de/page-builder/animated-effects)).

**Blocktransparenz** – ist ein Hintergrundeffekt aktiv, steuert dieser Schieberegler, wie stark die Oberfläche eines Blocks „Volle Breite“ ausbleicht, damit der Effekt darunter sichtbar wird. Dies gilt unabhängig vom Hintergrundtyp.

### Typografie

Überschreiben Sie die Schriftart separat für Überschriften, Fließtext und Beschriftungen/Buttons. Wählen Sie aus der integrierten Schriftartenliste oder geben Sie einen beliebigen Google-Fonts-Namen ein (zum Beispiel `Montserrat` oder `Roboto`), um ihn statt des Standard-Stacks der Voreinstellung zu verwenden.

<Note>
  Schriftart-Überschreibungen hier gelten für jeden Block, der keine eigene blockspezifische Schriftarteinstellung hat. Die eigene Schriftart eines Blocks im [Design-Tab](/de/page-builder/design-options) hat, wenn gesetzt, Vorrang vor dieser Theme-Überschreibung.
</Note>

### Form

Überschreiben Sie den Eckenradius unabhängig für Buttons, Karten, Bilder und Eingabefelder.

### Oberfläche

Überschreiben Sie den für Karten und erhabene Blöcke verwendeten Schatten- und Oberflächenstil, einschließlich eines Steuerelements **Kartenmaterial** (Voreinstellungsstandard / Karte / Dezent / Erhaben) neben dem Steuerelement für die Schattenvariante.

<Note>
  Dieser Abschnitt hieß in älterer Dokumentation zuvor „Schatten“. Er heißt jetzt **Oberfläche** und bietet zusätzlich zur Schattenvariante ein Steuerelement für das Kartenmaterial. Dieselben Tokens für Kartenoberfläche und Schatten können auch pro Block überschrieben werden – siehe [Designoptionen](/de/page-builder/design-options).
</Note>

### Effekte

Legen Sie die theme-weiten Standardeffekte für Hintergrund, Karte und Button fest. Siehe [Animierte Effekte](/de/page-builder/animated-effects) für den vollständigen Katalog.

### Abstand

Steuern Sie, wie viel Freiraum die Seite verwendet.

* **Abstand zwischen Blöcken** – der vertikale Abstand zwischen den Blöcken der Seite.
* **Abstandsskala** – ein Schieberegler, der alle Abstände auf der Seite gleichzeitig enger oder großzügiger macht (Zwischenräume, Kartenpolster, Blockabstand), ohne die Textgröße zu verändern. Belassen Sie ihn auf dem Standardwert für die Dichte des Themes, oder passen Sie ihn für ein luftigeres oder kompakteres Layout an.

## Dunkler und heller Modus

Themes werden mit einer festen Farbpalette definiert – sie wechseln nicht automatisch zwischen dunklem und hellem Modus je nach Geräteeinstellung des Besuchers. Wünschen Sie eine dunkle Seite, wählen Sie eine dunkle Voreinstellung (zum Beispiel Midnight oder Noir) oder legen Sie über die Überschreibung eine dunkle Hintergrundfarbe fest.

## Blockspezifische Design-Überschreibungen

Zusätzlich zu Themes auf Seitenebene haben viele Blöcke einen eigenen Design-Tab im Inspektor, in dem Sie Farben, Schriftarten und Kartenstil nur für diesen Block überschreiben können. Siehe [Designoptionen](/de/page-builder/design-options) für Details.

## Überschreibungen zurücksetzen

Um eine Überschreibung zu entfernen und zum Theme-Standard zurückzukehren, leeren Sie das Feld im Anpassen-Panel. Ein leeres Feld weist die Seite an, den Wert des Themes zu verwenden.

## Weiterführende Themen

* [Designoptionen](/de/page-builder/design-options) – blockspezifische Überschreibungen derselben hier gesetzten Tokens.
* [Animierte Effekte](/de/page-builder/animated-effects) – Hintergrund-, Karten- und Button-Effekte, die im Abschnitt Effekte festgelegt werden.
* [Page-Builder – Überblick](/de/page-builder/overview) – wo sich die Theme-Schaltfläche im Editor-Header befindet.
