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

> Importez vos designs, composants et ressources Figma dans votre projet

Macaly se connecte à Figma pour que l'agent puisse transformer vos designs en véritables pages et intégrer votre design system dans votre projet. Demandez-lui d'exporter une frame, de récupérer vos styles et variables, ou de créer une page directement à partir d'un fichier Figma.

## Qu'est-ce que Figma ?

Figma est un outil de design collaboratif pour les interfaces, les prototypes et les design systems. Avec l'intégration Figma, l'agent de Macaly lit directement vos fichiers Figma : il récupère la structure du design, les composants, les styles et les variables, génère les images et transforme vos designs en éléments fonctionnels de votre projet.

## Ce que vous pouvez faire

Quelques exemples de ce que l'agent peut faire avec Figma :

* **Transformer des designs en pages.** Récupérez la structure, les composants et les styles d'un fichier, et intégrez-les dans votre projet sous forme de pages réelles et responsives.
* **Utiliser votre design system.** Lisez les composants, les jeux de composants, les styles et les variables, et extrayez les design tokens (y compris une configuration Tailwind) pour garder votre projet fidèle à votre marque.
* **Exporter des images et des ressources.** Générez n'importe quelle frame ou nœud au format PNG, JPG, SVG ou PDF, et téléchargez les remplissages d'image d'un fichier.
* **Inspecter et transmettre.** Obtenez les métadonnées d'un fichier, les détails des nœuds, les interactions de prototype et les ressources pour développeurs afin d'assurer une transition propre du design au code.
* **Collaborer.** Lisez et publiez des commentaires, réagissez-y et consultez l'historique des versions d'un fichier.

## Comment ça marche

Vous décrivez ce que vous voulez dans le chat, et l'agent s'occupe du reste. Demandez une tâche ponctuelle, ou laissez l'agent intégrer Figma directement dans votre projet.

**Demandez directement à l'agent :**

```
Récupère les styles et les variables de couleur de ce fichier Figma et
transforme-les en une configuration Tailwind pour mon projet.
```

```
Exporte la frame « Hero » de mon fichier Figma au format SVG et
ajoute-la à la page d'accueil.
```

**Ou intégrez-le dans votre application :**

```
Voici mon design Figma [link]. Crée la page d'atterrissage à partir de
celui-ci : reproduis la mise en page, les composants et les espacements,
et rends-la responsive.
```

```
Je crée un site de documentation pour un design system. Récupère les
composants et les styles de notre bibliothèque Figma et liste-les avec
des aperçus.
```

## Bon à savoir

* **Vous vous connectez une seule fois.** Autorisez votre compte Figma la première fois, et l'agent réutilise cette connexion pour les demandes suivantes.
* **Certaines fonctionnalités de bibliothèque nécessitent un forfait Figma payant.** Les variables publiées et certaines parties des analyses de bibliothèque requièrent un forfait Figma Organization ou Enterprise.
* **Votre compte, votre contrôle.** L'agent n'agit que lorsque vous le lui demandez, et vous pouvez révoquer l'accès à tout moment depuis les paramètres de votre compte Figma.


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