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

# Figma

> Anslut Figma till ditt Macaly-konto

Figma är ett samarbetsverktyg för design av gränssnitt, prototyper och designsystem. Anslut ditt konto en gång, så gör agenten om dina designer, komponenter och stilar till fungerande delar av ditt projekt.

<Callout icon="user">
  Ingår i alla abonnemang
</Callout>

## Därför ansluter du Figma

* **Förvandla dina designer till riktiga sidor.** Peka agenten mot en Figma-fil, så bygger den layout, komponenter och avstånd till en responsiv sida. Du slipper bygga om din design för hand.
* **Håll bygget i linje med din profil automatiskt.** Agenten hämtar dina komponenter, stilar och variabler, inklusive en färdig Tailwind-konfiguration, så att projektet matchar ditt designsystem utan att du behöver skapa om något manuellt.
* **Lämna över designer utan att lämna chatten.** Exportera valfri frame som bild, hämta utvecklarresurser och filinformation och slipp pendla mellan Figma och ditt projekt.

## Det här behöver du

* Ett **Figma-konto**. Skapa ett gratis på [figma.com](https://www.figma.com)
* Ett Figma-abonnemang av typen Organization eller Enterprise om du vill ha publicerade variabler eller fullständig biblioteksanalys

## Anslut Figma till Macaly

<Steps>
  <Step title="Öppna Inställningar">
    Gå till **Inställningar → Integrationer** i din Macaly-workspace.
  </Step>

  <Step title="Anslut Figma">
    Hitta kortet för Figma i listan över appar och klicka på knappen **Anslut**.
  </Step>

  <Step title="Godkänn ditt konto">
    Ett nytt fönster öppnas där du får logga in på Figma. När du har godkänt åtkomsten skickas du tillbaka till Macaly.
  </Step>
</Steps>

## Använd Figma från chatten

När kontot är anslutet beskriver du vad du vill ha, så sköter agenten resten.

Gör en design till en sida:

```
Här är min Figma-design för prissidan [länk]. Bygg den till en
riktig sida, matcha layout, komponenter och avstånd, och gör den
responsiv.
```

Ta in ditt designsystem i projektet:

```
Hämta stilarna och färgvariablerna från den här Figma-filen och
gör om dem till en Tailwind-konfiguration för mitt projekt.
```

Exportera material medan du bygger:

```
Exportera framen "Hero" från min Figma-fil som SVG och lägg
till den på startsidan.
```

Eller bygg vidare på ditt designbibliotek:

```
Jag bygger en dokumentationssajt för ett designsystem. Hämta
komponenterna och stilarna från vårt Figma-bibliotek och lista
dem med förhandsvisningar.
```

## Det här kan agenten göra i Figma

Göra om en fils struktur, komponenter och stilar till responsiva sidor, hämta ut designtokens och en Tailwind-konfiguration, exportera frames som bilder samt hämta filinformation, kommentarer och versionshistorik för en smidig överlämning. Publicerade variabler och biblioteksanalys kräver Figma Organization eller Enterprise.

## Bra att veta

* **Du ansluter en gång.** Alla projekt i din workspace använder samma Figma-anslutning.
* **Vissa biblioteksfunktioner kräver ett betalt Figma-abonnemang.** Publicerade variabler och delar av biblioteksanalysen kräver ett Figma-abonnemang av typen Organization eller Enterprise.
* **Ditt konto, din kontroll.** Agenten agerar bara när du ber om det. Du kan koppla från Figma när som helst under **Inställningar → Integrationer**.


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