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

# Figma

> Haal Figma-designs, componenten en assets op in je project

Macaly koppelt aan Figma zodat de agent uw designs kan omzetten in echte pagina's en uw designsysteem in uw project kan halen. Vraag om een frame te exporteren, uw stijlen en variabelen op te halen of een pagina rechtstreeks vanuit een Figma-bestand te bouwen.

## Wat is Figma?

Figma is een collaboratieve designtool voor interfaces, prototypes en designsystemen. Met de Figma-integratie leest de agent van Macaly uw Figma-bestanden rechtstreeks: hij haalt de designstructuur, componenten, stijlen en variabelen op, rendert afbeeldingen en zet uw designs om in werkende onderdelen van uw project.

## Wat u kunt doen

Een paar voorbeelden van wat de agent met Figma kan doen:

* **Designs omzetten in pagina's.** Haal de structuur, componenten en stijlen van een bestand op en bouw ze in uw project als echte, responsive pagina's.
* **Uw designsysteem gebruiken.** Lees componenten, componentsets, stijlen en variabelen, en haal design tokens (inclusief een Tailwind-config) op om uw build merkconsistent te houden.
* **Afbeeldingen en assets exporteren.** Render elk frame of elke node als PNG, JPG, SVG of PDF, en download image fills uit een bestand.
* **Inspecteren en overdragen.** Krijg bestandsmetadata, nodedetails, prototype-interacties en dev-resources voor een soepele overdracht van design naar code.
* **Samenwerken.** Lees en plaats reacties, reageer erop en bekijk de versiegeschiedenis van een bestand.

## Hoe het werkt

U beschrijft in de chat wat u wilt en de agent regelt de rest. Vraag om een eenmalige taak of laat de agent Figma rechtstreeks in uw project inbouwen.

**Vraag het de agent rechtstreeks:**

```
Haal de stijlen en kleurvariabelen uit dit Figma-bestand en zet
ze om in een Tailwind-config voor mijn project.
```

```
Exporteer het "Hero"-frame uit mijn Figma-bestand als SVG en
voeg het toe aan de homepage.
```

**Of bouw het in uw app:**

```
Hier is mijn Figma-design [link]. Bouw er de landingspagina van —
neem de lay-out, componenten en spacing over, en maak hem responsive.
```

```
Ik bouw een docs-site voor een designsysteem. Haal de componenten
en stijlen uit onze Figma-bibliotheek en toon ze in een lijst met previews.
```

## Goed om te weten

* **U koppelt eenmalig.** Geef de eerste keer toegang tot uw Figma-account, en de agent hergebruikt die verbinding voor latere verzoeken.
* **Sommige bibliotheekfuncties vereisen een betaald Figma-pakket.** Gepubliceerde variabelen en delen van library analytics vereisen een Figma Organization- of Enterprise-pakket.
* **Uw account, uw controle.** De agent handelt alleen wanneer u erom vraagt, en u kunt de toegang op elk moment intrekken vanuit de instellingen van uw Figma-account.


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