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

> Collega Figma al tuo account Macaly

Figma è uno strumento di design collaborativo per interfacce, prototipi e design system. Collega il tuo account una sola volta e l'agente trasformerà direttamente i tuoi design, componenti e stili in parti funzionanti del tuo progetto.

<Callout icon="user">
  Disponibile in tutti i piani
</Callout>

## Perché collegare Figma

* **Trasforma i tuoi design in pagine vere.** Indica all'agente un file Figma e lui trasforma layout, componenti e spaziature in una pagina responsive, così non devi ricostruire il design a mano.
* **Mantieni automaticamente il progetto in linea con il brand.** L'agente estrae componenti, stili e variabili, inclusa una configurazione Tailwind pronta all'uso, così il tuo progetto rispetta il design system senza ricrearlo manualmente.
* **Consegna i design senza uscire dalla chat.** Esporta qualsiasi frame come immagine, recupera le risorse per lo sviluppo e i dettagli del file, ed evita i continui passaggi tra Figma e il tuo progetto.

## Cosa ti serve

* Un **account Figma**. Creane uno gratuitamente su [figma.com](https://www.figma.com)
* Un piano Figma Organization o Enterprise se vuoi le variabili pubblicate o le analytics complete della libreria

## Collega Figma a Macaly

<Steps>
  <Step title="Apri le impostazioni">
    Vai su **Impostazioni → Integrazioni** nel tuo workspace Macaly.
  </Step>

  <Step title="Collega Figma">
    Trova la scheda Figma nell'elenco delle app e fai clic sul pulsante **Connetti**.
  </Step>

  <Step title="Autorizza il tuo account">
    Si apre una nuova finestra in cui ti verrà chiesto di accedere a Figma. Una volta approvato l'accesso, verrai reindirizzato a Macaly.
  </Step>
</Steps>

## Usa Figma dalla chat

Una volta collegato l'account, descrivi cosa vuoi e l'agente si occupa del resto.

Trasforma un design in una pagina:

```
Ecco il mio design Figma per la pagina dei prezzi [link]. Trasformalo
in una pagina vera, rispettando layout, componenti e spaziature, e
rendila responsive.
```

Porta il tuo design system nel progetto:

```
Estrai gli stili e le variabili di colore da questo file Figma e
trasformali in una configurazione Tailwind per il mio progetto.
```

Esporta asset mentre lavori:

```
Esporta il frame "Hero" dal mio file Figma in SVG e aggiungilo
alla homepage.
```

Oppure crea qualcosa basato sulla tua libreria di design:

```
Sto creando un sito di documentazione per il design system. Estrai i
componenti e gli stili dalla nostra libreria Figma ed elencali con le
anteprime.
```

## Cosa può fare l'agente in Figma

Trasformare la struttura, i componenti e gli stili di un file in pagine responsive, estrarre i design token e una configurazione Tailwind, esportare i frame come immagini e recuperare dettagli del file, commenti e cronologia delle versioni per una consegna pulita. Le variabili pubblicate e le analytics della libreria richiedono Figma Organization o Enterprise.

## Buono a sapersi

* **Colleghi l'account una sola volta.** Ogni progetto nel tuo workspace riutilizza la stessa connessione a Figma.
* **Alcune funzionalità della libreria richiedono un piano Figma a pagamento.** Le variabili pubblicate e parte delle analytics della libreria richiedono un piano Figma Organization o Enterprise.
* **Il tuo account, il tuo controllo.** L'agente agisce solo quando glielo chiedi. Puoi disconnettere Figma in qualsiasi momento da **Impostazioni → Integrazioni**.


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