Skip to main content
Ett tema är en delad färgpalett och hörnradie för dina skärmar. Varje fil har ett tema och ett utseende (ljust eller mörkt), och skärmar stylas med temats tokens. Redigerar du ett tema följer varje skärm som använder det med, så att ditt team arbetar utifrån en uppsättning beslut i stället för att upprepa färger i varje prompt. Teman du skapar eller genererar sparas i din organisation och visas under Themes på Home, så att alla filer i organisationen kan använda dem.

​
Välj ett tema för en fil

Välj tema och utseende för nya skärmar i promptkomponeraren inuti en fil. Temaknappen finns inte i promptrutan på Home.
1

Öppna temamenyn

I promptkomponeraren klickar du på temaknappen — den visar det aktuella temats färgprov, eller ett färghjul när temat är Automatic. Menyn har rubriken Theme for new screens.
2

Välj ett tema

Välj Automatic, ett av din organisations teman (listas först) eller ett inbyggt tema: Default, Blue, Grayscale, Green, Ice, Orange, Red, Rose, Violet eller Yellow.
3

Välj ett utseende

Under Appearance väljer du Light eller Dark, eller Automatic för att låta Flowstep avgöra per skärm utifrån din prompt — “en mörk instrumentpanel” blir mörk.
Ditt val gäller för de skärmar du genererar härnäst. Skärmar som redan finns på canvasen behåller sitt utseende.

​
Låt Flowstep designa ett tema

När en fil ännu inte har något tema — en ny fil med temat kvar på Automatic — designar Flowstep ett anpassat tema tillsammans med de första skärmarna som genereras. Du ser ett steg Designing theme i chatten medan den arbetar. Flowstep bygger temat utifrån:
  • Färger du anger i din prompt
  • Färger i dina designriktlinjer
  • Varumärkesfärger från bilagor och länkar du klistrar in
  • Produkten och stämningen som din prompt beskriver, när det inte finns något mer specifikt att gå på
Temat får ett kort namn, en komplett palett för både ljust och mörkt, och ett steg för hörnradie. Det sparas i din organisation under Themes på Home, och filen använder det för varje skärm som genereras därefter. När en fil har ett tema designar Flowstep inte ett nytt på egen hand. För att få ett nytt tema väljer du Automatic igen i temamenyn — nästa generering designar ett nytt tema och filen övergår till det. Om Flowstep inte kan designa ett tema faller filen tillbaka på ett inbyggt tema.
Nämn dina varumärkesfärger i din första prompt, eller ange dem i dina designriktlinjer innan du genererar, så startar det genererade temat från dem.

​
Ändra temat för en skärm

För att anpassa en enskild skärm utan att påverka resten av filen:
  1. Markera skärmen på canvasen.
  2. Klicka på knappen Theme i menyn ovanför skärmen.
  3. Välj ett av din organisations teman eller ett inbyggt tema, eller växla mellan Light och Dark.
Att byta tema målar om skärmen direkt. Att växla mellan Light och Dark ber AI:n att omstila skärmen, precis som en AI-redigering. Menyn är inte tillgänglig medan en generering körs.

​
Redigera ett tema

Öppna ett tema från avsnittet Themes på Home. Temaredigeraren visar en förhandsvisning av temat i realtid, med Theme settings till höger. Använd knapparna Light och Dark högst upp för att växla förhandsvisningen, och klicka på temats namn för att byta namn på det.
  • Colors — varje färggrupp har ett färgprov för ljust och ett för mörkt: Primary, Secondary, Accent, Muted, Destructive, Background, Card, Popover, Border, Input, Ring, Charts och Sidebar. Klicka på ett färgprov för att redigera dess färger — till exempel en grupps fyll- och textfärg — med färgväljaren eller ett hexvärde.
  • Radius — välj ett steg för hörnradie (Square, Slight, Balanced, Soft eller Round), eller välj Custom och dra i Base radius för att ange ditt eget värde.
Dina ändringar sparas som ett utkast, så att skärmarna inte ändras medan du arbetar. När du är klar:
  • Klicka på Publish för att uppdatera varje skärm som använder temat. Flowstep bekräftar med “Published. Screens using this theme are updating.”
  • Klicka på Reset changes för att kassera dina opublicerade ändringar. Skärmar som använder temat påverkas inte.
Om du vill ta bort ett tema klickar du på Delete theme längst ner under Theme settings, eller på papperskorgsikonen bredvid det i listan Themes på Home. Ett borttaget tema erbjuds inte längre i temamenyerna, men skärmar som redan använder det behåller sitt utseende, så inget på din canvas ändras.
Alla i din organisation utom Guests (gäster) kan redigera och ta bort teman.

​
Koppla färger och hörn till ditt tema

Färger och hörn kan peka på en temattoken i stället för ett fast värde. Ett kopplat värde följer skärmens tema, så när temat ändras — ett annat tema, en publicerad redigering eller en växling mellan ljust och mörkt — uppdateras kopplade färger och hörn med det. Colors — klicka på färgprovet i panelen Fill eller Border. På fliken Token söker du efter eller väljer en token från grupperna Theme, Base eller Tailwind. Använd fliken Custom för en exakt färg. En kopplad färg visar sitt tokennamn i panelen, och du kan fortfarande justera dess opacitet. Corners — klicka på en hörnförhandsvisning i panelen Corners. På fliken Token väljer du ett steg (till exempel md eller lg); på fliken Custom skriver du ett exakt värde i pixlar. Ett kopplat hörn visar sitt tokennamn, och när temats avrundning ändras avrundas det om. Om du vill göra ett kopplat värde fast igen klickar du på Detach from token. Färgen eller hörnet behåller sitt nuvarande utseende men följer inte längre temat.

​
Bra att veta

  • Skärmar behåller sitt eget tema — varje skärm minns sitt tema och utseende. Att ändra filens tema påverkar bara skärmar du genererar härnäst. Använd menyn Theme för varje skärm för att anpassa befintliga.
  • Endast publicerade versioner — skärmar visar temats publicerade version. Utkast syns bara i temaredigeraren tills du publicerar.
  • Tokenkopplingar består vid redigering — temafärger som används i skuggor, filter och gradienter förblir kopplade till temat när Flowstep redigerar eller genererar om en skärm.
  • Avrundningssteg som inte påverkas av temat — hörntokens none och full är alltid helt kantiga respektive helt runda, oavsett temats avrundning.