> ## Documentation Index
> Fetch the complete documentation index at: https://docs.flowstep.ai/llms.txt
> Use this file to discover all available pages before exploring further.
# Themes nutzen, um Farben und Eckenrundung über alle Flowstep-Screens hinweg konsistent zu halten
> Wählen oder generieren Sie für jede Datei ein Theme, passen Sie einzelne Screens an, bearbeiten Sie die Themes Ihrer Organisation und verknüpfen Sie Farben und Ecken mit Theme-Tokens, damit Änderungen auf alle Screens übertragen werden.
Ein Theme ist eine gemeinsame Farbpalette und Eckenrundung für Ihre Screens. Jede Datei hat ein Theme und ein Erscheinungsbild (hell oder dunkel), und Screens werden mit den Tokens des Themes gestaltet. Wenn Sie ein Theme bearbeiten, folgt jeder Screen, der es verwendet, dieser Änderung. Ihr Team arbeitet so mit einem gemeinsamen Satz an Entscheidungen, statt Farben in jedem Prompt neu festzulegen.
Themes, die Sie erstellen oder generieren, werden in Ihrer Organisation gespeichert und unter **Themes** auf Home aufgelistet. So kann jede Datei in der Organisation sie verwenden.
## Ein Theme für eine Datei auswählen
Wählen Sie Theme und Erscheinungsbild für neue Screens im Prompt-Composer innerhalb einer Datei. Die Theme-Schaltfläche ist im Prompt-Feld auf Home nicht verfügbar.
Klicken Sie im Prompt-Composer auf die Theme-Schaltfläche. Sie zeigt das Farbmuster des aktuellen Themes oder ein Farbrad, wenn das Theme **Automatic** ist. Das Menü trägt den Titel **Theme for new screens**.
Wählen Sie **Automatic**, eines der Themes Ihrer Organisation (oben aufgelistet) oder ein integriertes Theme: **Default**, **Blue**, **Grayscale**, **Green**, **Ice**, **Orange**, **Red**, **Rose**, **Violet** oder **Yellow**.
Wählen Sie unter **Appearance** entweder **Light** oder **Dark** oder **Automatic**. Mit **Automatic** entscheidet Flowstep pro Screen anhand Ihres Prompts. Ein Prompt wie „a dark dashboard“ ergibt einen dunklen Screen.
Ihre Auswahl gilt für die Screens, die Sie als Nächstes generieren. Screens, die bereits auf der Canvas liegen, behalten ihr Aussehen.
## Flowstep ein Theme entwerfen lassen
Wenn eine Datei noch kein Theme hat, etwa eine neue Datei, bei der das Theme auf **Automatic** steht, entwirft Flowstep zusammen mit den ersten generierten Screens ein eigenes Theme. Während Flowstep daran arbeitet, sehen Sie im Chat einen Schritt **Designing theme**.
Flowstep erstellt das Theme aus:
* Farben, die Sie in Ihrem Prompt nennen
* Farben in Ihren [Design-Richtlinien](/de/design-guidelines)
* Markenfarben aus Anhängen und [Links, die Sie einfügen](/de/design-references#paste-a-url)
* Dem Produkt und der Stimmung, die Ihr Prompt beschreibt, wenn es keine genaueren Vorgaben gibt
Das Theme erhält einen kurzen Namen, eine vollständige Palette für helle und dunkle Darstellung sowie eine Eckenrundung. Es wird in Ihrer Organisation unter **Themes** auf Home gespeichert, und die Datei verwendet es für alle danach generierten Screens.
Sobald eine Datei ein Theme hat, entwirft Flowstep von sich aus kein weiteres. Wenn Sie ein neues Theme möchten, wählen Sie im Theme-Menü erneut **Automatic**. Die nächste Generierung entwirft dann ein neues Theme, und die Datei übernimmt es. Wenn Flowstep kein Theme entwerfen kann, greift die Datei auf ein integriertes Theme zurück.
Nennen Sie Ihre Markenfarben in Ihrem ersten Prompt oder legen Sie sie in Ihren [Design-Richtlinien](/de/design-guidelines) fest, bevor Sie generieren. Das generierte Theme startet dann von diesen Farben.
## Theme eines einzelnen Screens ändern
Um einen einzelnen Screen neu zu gestalten, ohne den Rest der Datei zu berühren:
1. Wählen Sie den Screen auf der Canvas aus.
2. Klicken Sie im Menü über dem Screen auf die Schaltfläche **Theme**.
3. Wählen Sie eines der Themes Ihrer Organisation oder ein integriertes Theme, oder wechseln Sie zwischen **Light** und **Dark**.
Ein Theme-Wechsel färbt den Screen sofort um. Der Wechsel zwischen **Light** und **Dark** lässt die KI den Screen neu gestalten, genau wie bei einer [KI-Bearbeitung](/de/editing-designs). Das Menü ist nicht verfügbar, während eine Generierung läuft.
## Ein Theme bearbeiten
Öffnen Sie ein Theme im Bereich **Themes** auf Home. Der Theme-Editor zeigt eine Live-Vorschau des Themes, rechts mit **Theme settings**. Verwenden Sie die Schaltflächen **Light** und **Dark** oben, um die Vorschau umzuschalten. Klicken Sie auf den Namen des Themes, um es umzubenennen.
* **Colors** – jede Farbgruppe hat ein Muster für hell und eines für dunkel: **Primary**, **Secondary**, **Accent**, **Muted**, **Destructive**, **Background**, **Card**, **Popover**, **Border**, **Input**, **Ring**, **Charts** und **Sidebar**. Klicken Sie auf ein Farbmuster, um seine Farben zu bearbeiten, etwa die Füll- und Textfarbe einer Gruppe. Nutzen Sie dafür den Farbwähler oder einen Hex-Wert.
* **Radius** – wählen Sie eine Eckenstufe (**Square**, **Slight**, **Balanced**, **Soft** oder **Round**). Oder wählen Sie **Custom** und ziehen Sie **Base radius**, um Ihren eigenen Wert festzulegen.
Ihre Änderungen werden als Entwurf gespeichert, damit sich Screens während der Arbeit nicht verändern. Wenn Sie so weit sind:
* Klicken Sie auf **Publish**, um jeden Screen zu aktualisieren, der das Theme verwendet. Flowstep bestätigt mit „Published. Screens using this theme are updating.“ (sinngemäß: Veröffentlicht. Screens, die dieses Theme verwenden, werden aktualisiert.)
* Klicken Sie auf **Reset changes**, um Ihre unveröffentlichten Änderungen zu verwerfen. Screens, die das Theme verwenden, sind davon nicht betroffen.
Um ein Theme zu entfernen, klicken Sie unten in **Theme settings** auf **Delete theme** oder auf das Papierkorb-Symbol daneben in der Liste **Themes** auf Home. Ein gelöschtes Theme wird in Theme-Menüs nicht mehr angeboten. Screens, die es bereits verwenden, behalten jedoch ihr Aussehen, sodass sich auf Ihrer Canvas nichts ändert.
Alle in Ihrer Organisation außer Guests (Gäste) können Themes bearbeiten und löschen.
## Farben und Ecken mit Ihrem Theme verknüpfen
Farben und Ecken können auf ein Theme-Token statt auf einen festen Wert verweisen. Ein verknüpfter Wert folgt dem Theme des Screens. Ändert sich das Theme, etwa durch ein anderes Theme, eine veröffentlichte Bearbeitung oder einen Wechsel zwischen hell und dunkel, aktualisieren sich verknüpfte Farben und Ecken mit.
**Colors**: Klicken Sie im Panel **Fill** oder **Border** auf das Farbmuster. Wählen Sie auf dem Tab **Token** ein Token aus den Gruppen **Theme**, **Base** oder **Tailwind**, oder suchen Sie danach. Verwenden Sie den Tab **Custom** für eine exakte Farbe. Eine verknüpfte Farbe zeigt ihren Token-Namen im Panel, und Sie können ihre Deckkraft weiterhin anpassen.
**Corners**: Klicken Sie im Panel **Corners** auf eine Eckenvorschau. Wählen Sie auf dem Tab **Token** eine Stufe (zum Beispiel `md` oder `lg`). Auf dem Tab **Custom** geben Sie einen exakten Wert in Pixeln ein. Eine verknüpfte Ecke zeigt ihren Token-Namen, und wenn Sie die Eckenrundung des Themes ändern, wird sie neu gerundet.
Um einen verknüpften Wert wieder in einen festen Wert zu verwandeln, klicken Sie auf **Detach from token**. Die Farbe oder Ecke behält ihr aktuelles Aussehen, folgt dem Theme aber nicht mehr.
## Gut zu wissen
* **Screens behalten ihr eigenes Theme**: Jeder Screen merkt sich sein Theme und Erscheinungsbild. Eine Änderung des Datei-Themes wirkt sich nur auf Screens aus, die Sie als Nächstes generieren. Bestehende Screens passen Sie über das Theme-Menü des jeweiligen Screens an.
* **Nur veröffentlichte Versionen**: Screens zeigen die veröffentlichte Version eines Themes. Entwürfe sind nur im Theme-Editor sichtbar, bis Sie veröffentlichen.
* **Token-Verknüpfungen bleiben erhalten**: Theme-Farben, die in Schatten, Filtern und Verläufen verwendet werden, bleiben mit dem Theme verknüpft, wenn Flowstep einen Screen bearbeitet oder neu generiert.
* **Rundungsstufen, die sich nicht skalieren**: Die Eck-Tokens `none` und `full` sind immer eckig beziehungsweise vollständig rund, unabhängig von der Rundung des Themes.
This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.