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

# Design-Einstellungen für globale Stile und Branding

> Passen Sie globale Design-Einstellungen wie Farben, Schriften und Stile an, um einheitliche und professionelle Funnel-Designs zu gestalten.

Im Design-Tab legen Sie das **Erscheinungsbild Ihres gesamten Ablaufs** fest. Von Farben über Typografie bis zu Komponentenstilen lässt sich alles an Ihre Marke anpassen.

Statt jedes Element einzeln zu gestalten, nutzt LanderLab ein **globales Designsystem** – Ihre Änderungen wirken sich also automatisch auf den gesamten Ablauf aus.

## So öffnen Sie die Design-Einstellungen

Dafür gibt es zwei Wege:

* Klicken Sie im linken Panel auf das **Farbpaletten-Symbol** → für globale Stile
* Klicken Sie bei einem beliebigen Block auf die **drei Punkte (•••)** und wählen Sie **Design** → für den direkten Zugriff

Standardmäßig werden alle Designänderungen global angewendet.

<Frame>
  <img src="https://mintcdn.com/landerlab-babdc23f/43_hzYqVklW9Fu-X/images/image-5-1024x571.png?fit=max&auto=format&n=43_hzYqVklW9Fu-X&q=85&s=c04f4b9ca8b518854114f8aff5254b1f" alt="Image 5 1024x571" width="1024" height="571" data-path="images/image-5-1024x571.png" />
</Frame>

***

## So funktioniert das Design

Design-Einstellungen werden über ein Vererbungssystem im gesamten Ablauf geteilt:

* Änderungen an Stilen aktualisieren alle vergleichbaren Blöcke automatisch
* Das sorgt für Einheitlichkeit im gesamten Ablauf
* Es spart Zeit, weil wiederholte Anpassungen entfallen

Bei Bedarf können Sie Stile einzelner Blöcke weiterhin überschreiben.

***

## Farben

Das Farben-Panel definiert die visuelle Identität Ihres Ablaufs.

### Hauptfarben

* **Primary Color** → für Schaltflächen, Auswahlen und zentrale Aktionen
* **Secondary Color** → für Akzente und Hervorhebungen

### Neutrale Farben

* Schwarz-, Weiß- und Grauabstufungen
* Für Text, Hintergründe und Struktur

### Fehlerfarbe

* Wird automatisch bei Validierungsfehlern und ungültigen Eingaben verwendet

💡 Tipp: Legen Sie zuerst Ihre Primär- und Sekundärfarbe fest, um eine einheitliche Markenbasis zu schaffen.

<video src="https://mintcdn.com/landerlab-babdc23f/43_hzYqVklW9Fu-X/videos/change-color.webm?fit=max&auto=format&n=43_hzYqVklW9Fu-X&q=85&s=48d0ac29a81869b1488a33eb8127f3ea" controls={true} data-path="videos/change-color.webm" />

***

## Schriften

Ihr Ablauf übernimmt die Schriften automatisch von der **Landingpage**, auf der er platziert ist.

* Sie müssen im Ablauf keine Schriften konfigurieren
* Das hält alles optisch einheitlich

💡 Tipp: Legen Sie Ihre Schriften auf Ebene der Landingpage fest, damit alle Abläufe zu Ihrem Markenstil passen.

***

## Presets

<video src="https://mintcdn.com/landerlab-babdc23f/43_hzYqVklW9Fu-X/videos/presets.webm?fit=max&auto=format&n=43_hzYqVklW9Fu-X&q=85&s=1906a157a2f3a2031e57735d3ca3620a" controls={true} data-path="videos/presets.webm" />

Presets sind vorgefertigte Stile, die Sie sofort auf Blöcke anwenden können.

Statt Stile von Grund auf zu bauen, können Sie:

* Ein Preset anwenden
* Es bei Bedarf anpassen

### Beispiel

Wenden Sie ein Preset auf einen Multiple-Choice-Block an, werden automatisch gesetzt:

* Farben
* Abstände
* Schaltflächenstile

Durch die globale Vererbung gilt:

* Die Änderung eines Blockstils aktualisiert alle vergleichbaren Blöcke

***

## Warum Presets nutzen

* Schnellere Einrichtung
* Einheitliches Design
* Keine Designerfahrung nötig

💡 Tipp: Starten Sie mit den Standard-Presets und passen Sie später bei Bedarf an. So bleibt Ihr Ablauf von Anfang an aufgeräumt und professionell.

***

## Bewährte Vorgehensweisen

* Legen Sie Farben fest, bevor Sie Ihren Ablauf bauen
* Halten Sie die Stile über alle Schritte hinweg einheitlich
* Vermeiden Sie es, jeden Block übermäßig anzupassen
* Nutzen Sie Presets, um Zeit zu sparen