> ## 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.

# Témák használata a színek és a sarokkerekítések egységesen tartásához a Flowstep-képernyőkön

> Válassz vagy generálj témát minden fájlhoz, szabd át egyes képernyők stílusát, szerkeszd a szervezeted témáit, és kösd a színeket és a sarkokat téma-tokenekhez, hogy a változások minden képernyőn érvényesüljenek.

A téma egy megosztott színpaletta és sarokkerekítés a képernyőidhez. Minden fájlnak van témája és megjelenése (világos vagy sötét), a képernyők pedig a téma tokenjeivel vannak stilizálva. Ha szerkeszted a témát, minden azt használó képernyő követi a változást, így a csapatod egy közös döntéshalmazon dolgozik, és nem kell minden promptban újra megadni a színeket.

A létrehozott vagy generált témák a szervezetedhez mentődnek, és a Home oldalon a **Themes** alatt jelennek meg, így a szervezet bármely fájlja használhatja őket.

## Téma kiválasztása egy fájlhoz

Az új képernyők témáját és megjelenését a fájlon belüli prompt-szerkesztőben választhatod ki. A téma gomb nem érhető el a Home oldali promptdobozban.

<Steps>
  <Step title="Nyisd meg a téma menüt">
    A prompt-szerkesztőben kattints a téma gombra. Ez az aktuális téma színmintáját mutatja, vagy színkereket, ha a téma **Automatic**. A menü címe **Theme for new screens**.
  </Step>

  <Step title="Válassz témát">
    Válaszd az **Automatic** lehetőséget, a szervezeted egyik témáját (ezek az elsők a listában), vagy egy beépített témát: **Default**, **Blue**, **Grayscale**, **Green**, **Ice**, **Orange**, **Red**, **Rose**, **Violet** vagy **Yellow**.
  </Step>

  <Step title="Válassz megjelenést">
    Az **Appearance** alatt válaszd a **Light** vagy a **Dark** lehetőséget, vagy az **Automatic** beállítást, hogy a Flowstep képernyőnként a prompt alapján döntsön. Például a „sötét irányítópult” sötét lesz.
  </Step>
</Steps>

<Note>
  A választásod a következőkben generált képernyőkre vonatkozik. A vásznon már meglévő képernyők megtartják a megjelenésüket.
</Note>

## Hagyd, hogy a Flowstep tervezze meg a témát

Ha a fájlnak még nincs témája – például egy új fájlnál, ahol a téma **Automatic** marad –, a Flowstep az első generált képernyőkkel együtt egyedi témát tervez. A csevegésben látni fogod a **Designing theme** lépést, amíg dolgozik.

A Flowstep a témát a következőkből építi fel:

* A promptodban megnevezett színek
* A [tervezési irányelveidben](/hu/design-guidelines) szereplő színek
* A csatolmányokból és a [beillesztett linkekből](/hu/design-references#paste-a-url) származó márkaszínek
* A prompt által leírt termék és hangulat, ha nincs más konkrétum

A téma rövid nevet, teljes palettát világos és sötét módhoz, valamint egy kerekítési lépést kap. A szervezeted **Themes** részébe kerül a Home oldalon, a fájl pedig minden ezután generált képernyőhöz ezt használja.

Ha a fájlnak már van témája, a Flowstep nem tervez másikat magától. Új téma kéréséhez válaszd újra az **Automatic** lehetőséget a téma menüben – a következő generálás új témát tervez, és a fájl ahhoz igazodik. Ha a Flowstep nem tud témát tervezni, a fájl egy beépített témára vált vissza.

<Tip>
  Említsd meg a márkaszíneidet az első promptodban, vagy állítsd be őket a [tervezési irányelveidben](/hu/design-guidelines) a generálás előtt, és a generált téma ezekből indul.
</Tip>

## Egy képernyő témájának megváltoztatása

Ha egyetlen képernyő stílusát szeretnéd átállítani anélkül, hogy a fájl többi részéhez nyúlnál:

1. Jelöld ki a képernyőt a vásznon.
2. A képernyő felett lévő menüben kattints a **Theme** gombra.
3. Válassz a szervezeted egyik témája vagy egy beépített téma közül, vagy válts a **Light** és a **Dark** között.

A téma váltása azonnal újrafesti a képernyőt. A **Light** és a **Dark** közötti váltás arra kéri az AI-t, hogy alakítsa át a képernyő stílusát, ugyanúgy, mint egy [AI-szerkesztés](/hu/editing-designs). A menü nem érhető el, amíg generálás fut.

## Téma szerkesztése

Nyiss meg egy témát a Home oldal **Themes** részéből. A témaszerkesztő a téma élő előnézetét mutatja, jobb oldalon a **Theme settings** panellel. A tetején lévő **Light** és **Dark** gombokkal válthatsz az előnézet között, a téma nevére kattintva pedig átnevezheted.

* **Colors** – minden színcsoportnak van egy mintája a világos és egy a sötét módhoz: **Primary**, **Secondary**, **Accent**, **Muted**, **Destructive**, **Background**, **Card**, **Popover**, **Border**, **Input**, **Ring**, **Charts** és **Sidebar**. Kattints egy mintára a színek szerkesztéséhez – például a csoport kitöltő- és szövegszínének – a színválasztóval vagy hexadecimális értékkel.
* **Radius** – válassz egy kerekítési lépést (**Square**, **Slight**, **Balanced**, **Soft** vagy **Round**), vagy válaszd a **Custom** lehetőséget, és húzd a **Base radius** csúszkát a saját értékedhez.

A szerkesztéseid piszkozatként mentődnek, így a képernyők nem változnak, amíg dolgozol. Ha kész vagy:

* Kattints a **Publish** gombra, hogy frissítsd az összes képernyőt, amely a témát használja. A Flowstep ezt megerősíti: "Published. Screens using this theme are updating." (Magyarul: „Közzétéve. A témát használó képernyők frissülnek.”)
* Kattints a **Reset changes** gombra, hogy elvesd a nem közzétett változtatásaidat. A témát használó képernyőket ez nem érinti.

Téma törléséhez kattints a **Theme settings** alján lévő **Delete theme** gombra, vagy a Home oldal **Themes** listájában a mellette lévő kukásikonra. A törölt téma már nem jelenik meg a téma menükben, de a már használó képernyők megtartják a megjelenésüket, így a vásznon semmi sem változik.

<Note>
  A szervezeted minden tagja, kivéve a Guest-eket (vendégeket), szerkesztheti és törölheti a témákat.
</Note>

## Színek és sarkok kötése a témához

A színek és a sarkok fix érték helyett téma-tokenre mutathatnak. A kötött érték követi a képernyő témáját, így ha a téma változik – másik téma, közzétett szerkesztés vagy váltás világos és sötét között –, a kötött színek és sarkok is vele együtt változnak.

**Colors** – a **Fill** vagy a **Border** panelen kattints a színmintára. A **Token** fülön keress vagy válassz egy tokent a **Theme**, a **Base** vagy a **Tailwind** csoportokból. Pontos színhez használd a **Custom** fület. A kötött szín a panelen megjeleníti a token nevét, és az átlátszóságát továbbra is módosíthatod.

**Corners** – a **Corners** panelen kattints egy sarokelőnézetre. A **Token** fülön válassz egy lépést (például `md` vagy `lg`); a **Custom** fülön pixelben add meg a pontos értéket. A kötött sarok megjeleníti a token nevét, és a téma kerekítésének módosításakor vele együtt változik.

Ha egy kötött értéket újra fixre szeretnél állítani, kattints a **Detach from token** gombra. A szín vagy sarok megtartja a jelenlegi megjelenését, de már nem követi a témát.

## Jó tudni

* **A képernyők megtartják a saját témájukat** – minden képernyő emlékszik a témájára és megjelenésére. A fájl témájának módosítása csak a következőkben generált képernyőkre hat; a meglévők átstílusozásához használd a képernyőnkénti **Theme** menüt.
* **Csak a közzétett verziók** – a képernyők a téma közzétett verzióját mutatják. A piszkozatok csak a témaszerkesztőben látszanak, amíg nem teszed közzé őket.
* **A token-kötések szerkesztés után is megmaradnak** – az árnyékokban, szűrőkben és átmenetekben használt témaszínek a témához kötve maradnak, amikor a Flowstep szerkeszt vagy újragenerál egy képernyőt.
* **A nem skálázódó kerekítési lépések** – a `none` és a `full` sarok-tokenek a téma kerekítésétől függetlenül mindig négyzetesek, illetve teljesen kerekek.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.