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

# Ladda ner Flowstep-designer som JPG- eller PNG-bildfiler

> Flowstep stöder export av designer som JPG eller PNG. Lär dig vilket format som passar för ditt användningsfall och hur du laddar ner dina skärmar på några klick.

<Frame>
  <img src="https://mintcdn.com/flowstep/UmnbuTkaA7N6vp1N/images/Screenshot-2026-05-06-at-14.19.49.png?fit=max&auto=format&n=UmnbuTkaA7N6vp1N&q=85&s=b9d31a01c99bae3d325fdbfee34529dc" alt="Screenshot 2026 05 06 At 14 19 49" width="1824" height="1388" data-path="images/Screenshot-2026-05-06-at-14.19.49.png" />
</Frame>

När du är redo att dela eller överlämna en design kan Flowstep exportera den som en statisk bild – antingen en JPG eller en PNG. Båda formaten stöds allmänt i designverktyg, presentationsprogram och webbläsare, så du kan ta dina AI-genererade designer vart som helst du behöver.

## Så exporterar du din design

<Steps>
  <Step title="Öppna din design">
    Navigera till den design du vill exportera i Flowstep.
  </Step>

  <Step title="Öppna exportmenyn">
    Hitta exportalternativet i verktygsfältet eller designpanelen. Välj det för att öppna exportinställningarna.
  </Step>

  <Step title="Välj ditt format">
    Välj antingen **JPG** eller **PNG** beroende på ditt användningsfall (se jämförelsen nedan).
  </Step>

  <Step title="Ladda ner filen">
    Bekräfta ditt val och ladda ner den exporterade bilden till din enhet.
  </Step>
</Steps>

<Frame>
  <img src="https://mintcdn.com/flowstep/UmnbuTkaA7N6vp1N/images/Screenshot-2026-05-06-at-14.19.39.png?fit=max&auto=format&n=UmnbuTkaA7N6vp1N&q=85&s=8f3132e26a9a759315dd87a7a624fe00" alt="Screenshot 2026 05 06 At 14 19 39" width="1828" height="1522" data-path="images/Screenshot-2026-05-06-at-14.19.39.png" />
</Frame>

## JPG eller PNG: vilket format ska du använda?

|                 | JPG                                                                         | PNG                                                          |
| --------------- | --------------------------------------------------------------------------- | ------------------------------------------------------------ |
| **Bäst för**    | Delning av förhandsgranskningar, presentationer, granskning av intressenter | Designer med transparenta bakgrunder, högupplöst överlämning |
| **Filstorlek**  | Mindre – snabbare att dela via e-post eller meddelanden                     | Större – behåller fullständig bilddetalj                     |
| **Transparens** | Stöds inte                                                                  | Stöds                                                        |
| **Kvalitet**    | Något komprimerad                                                           | Förlustfri – ingen kvalitetsreducering                       |

<Tip>
  Om du klistrar in din design i en bildspelsdäck eller skickar en snabb förhandsgranskning till en klient är JPG vanligtvis rätt val. Om du behöver skarpa kanter eller en transparent bakgrund – till exempel för att lägga designen på en annan bild – använd PNG.
</Tip>

## Exportera kod

Utöver bilder exporterar knappen **Code** en skärm som React + Tailwind-kod – kopiera ett kodavsnitt eller ladda ner hela paketet som en ZIP. Paketen är självständiga: bilder som används i designen (inklusive de du bifogar i chattningspanelen) ingår i en `public/assets/`-mapp med kod som refererar till dem via lokal sökväg, så exporten fungerar omedelbar.

Nedladdade filer – både bilder och kodpaket – namnges efter skärmen de tillhör (återgår till filnamnet om skärmen är namnlös), vilket gör det enkelt att identifiera exporter när du arbetar med många skärmar.

<Note>
  Om du behöver ta din design in i ett vektorredigeringsarbetsflöde kopierar du den direkt till Figma i stället. Se [Kopiera Flowstep-designer till Figma direkt](/sv/figma-integration).
</Note>