Utiliser la grille

La grille Master est l’éditeur de variables de l’onglet Master d’un projet. Chaque ligne est une variable ; il y a une colonne de valeur par mode (clair/sombre, langues, etc.). Les modifications faites dans la grille atteignent Figma quand vous appuyez sur Synchroniser dans le plugin.

Collections et groupes

• Changez de collection dans la liste Collections de la barre latérale gauche, et créez-en une avec le bouton + (Nouvelle collection). Un clic droit sur une collection propose Renommer / Exporter cette collection / Supprimer.
• Cliquez sur l’en-tête Collections de la barre latérale pour ouvrir le menu Ordre des collections — Ordre de création (par défaut) ou Nom (A→Z). L’ordre des collections réorganisé dans le panneau de Figma n’est pas lisible par les plugins et n’est donc pas importé.
• Un / dans le nom d’une variable forme un groupe (p. ex. color/primary → le groupe color). Choisissez un groupe dans l’arborescence Groupes pour filtrer la grille sur ce groupe ; choisissez Tout pour revoir toute la collection.

Créer, renommer et déplacer des groupes

• Sélectionnez des lignes et faites un clic droit sur Nouveau groupe avec la sélection — les variables sélectionnées sont réunies dans un groupe nommé Nouveau groupe. Renommez-le aussitôt dans la barre latérale.
• Faites un clic droit sur un groupe de la barre latérale et choisissez Renommer pour changer le chemin de toutes les variables de ce groupe (sous-groupes compris). Les alias qui pointent vers ces variables suivent automatiquement. Un nom de groupe ne peut pas être vide ni contenir /.
• Les cellules de nom de la grille n’affichent que le dernier segment ; l’en-tête du groupe porte le chemin. La modification par double-clic ne change que le dernier segment — pour modifier le chemin complet, utilisez le champ Nom de Modifier la variable (clic droit).
• Faites glisser un groupe de la barre latérale sur un autre groupe (ou sur Tout) pour déplacer son chemin sous la cible. Ctrl(⌘)+Z l’annule, et le même chemin atteint Figma après la synchronisation suivante. Vous ne pouvez pas déposer un groupe sur lui-même, sur l’un de ses sous-groupes ni sur son parent actuel.
• Les groupes et les variables ne se réorganisent pas par glisser-déposer.

Modifier les cellules

• Cliquez sur une cellule de valeur pour la modifier. Enter valide et descend ; Escape rétablit la valeur d’origine.
• Saisie selon le type : chaîne = texte, nombre = saisie numérique, booléen = interrupteur, couleur = sélecteur de couleur + hexadécimal.
• Les cellules de couleur affichent l’hexadécimal sans # à côté d’un segment alpha en %, comme dans Figma. Les formes courtes sont développées (f → FFFFFF), et sur 8 chiffres les deux derniers sont l’alpha — l’aide à la saisie indique « Hex, 6 ou 8 chiffres (les 2 derniers = alpha) ; les formes courtes sont développées (f → FFFFFF) ; {reference} fonctionne aussi ». Une valeur qui n’est pas une couleur n’est jamais enregistrée : elle est rétablie quand vous quittez la cellule, avec une notification « Ce n’est pas une couleur, modification annulée : {value} ».
• Le sélecteur de couleur a les onglets Personnalisé / Bibliothèques. Dans Bibliothèques, choisissez une autre variable de couleur de la même collection pour la lier comme référence (alias) ; Prélever une couleur à l’écran prélève une couleur à l’écran.
• Une cellule qui référence une autre variable s’affiche comme une pastille — elle n’indique que le dernier segment, et le survol révèle le chemin complet et la valeur résolue. Cliquez sur la pastille pour rouvrir le sélecteur et passer à une autre variable.
• Les variables de chaîne et de nombre peuvent aussi référencer. Survolez la cellule et utilisez le bouton Définir un alias pour choisir une variable du même type ; les trois types partagent le bouton Détacher l’alias, qui retire la référence et laisse la valeur résolue en place comme valeur simple.
• Un choix qui formerait une boucle est bloqué dans le sélecteur (« Créerait une référence circulaire »). Le collage ignore les cellules qui boucleraient et le signale dans la notification (« Cellules ignorées (référence circulaire) : {count} »).
• Double-cliquez sur une cellule de nom pour renommer une variable.
• Pour laisser un commentaire sur une cellule, appuyez sur C puis cliquez sur la cellule (Commentaires — « Appuyez sur C, puis cliquez sur une cellule. Reste actif jusqu’à ce que vous appuyiez sur Esc. »). Les cellules de description, de tag et de portée acceptent aussi les commentaires.

Ajouter, supprimer, dupliquer des lignes

• Choisissez un type (Couleur / Nombre / Chaîne / Booléen) depuis le + tout à gauche de la barre d’outils (Ajouter une variable) et une ligne est créée et mise au point sur place. Pas de formulaire de nom préalable — la nouvelle variable naît avec une valeur par défaut selon son type ; renommez-la sur place.
• Pour supprimer, sélectionnez des lignes et appuyez sur Delete, ou utilisez Supprimer dans le menu contextuel.
• Shift+Enter — sur une seule ligne, insère juste en dessous une nouvelle ligne du même type ; avec plusieurs lignes sélectionnées, les duplique.
• L’option Dupliquer du menu contextuel fonctionne aussi.
• Menu contextuel d’une ligne : Copier · Dupliquer · Modifier la variable · Nouveau groupe avec la sélection · Déplacer vers une collection ▸ (liste des collections + Nouvelle collection) · Voir les références · Exporter cette collection · Supprimer.

Déplacer des variables vers une autre collection

• Sélectionnez des lignes, faites un clic droit sur Déplacer vers une collection ▸ et choisissez la collection cible ou Nouvelle collection. Si les deux collections ont les mêmes noms de modes, les lignes se déplacent immédiatement.
• Si les modes diffèrent, la boîte Déplacer vers {collection} s’ouvre avec un tableau Valeurs à conserver. Pour chaque mode de la collection actuelle, placez sa valeur dans l’une des colonnes de mode cibles ou choisissez Écarter. Tant qu’un mode n’est pas placé, le bouton reste verrouillé et la boîte indique « Pas encore placés : {modes} ». Le bouton affiche Déplacer, ou Écarter {count} et déplacer quand un choix abandonne des valeurs — il n’y a pas de confirmation séparée. Réinitialiser rétablit la disposition initiale.
• Après le déplacement, une notification « {count} variable(s) déplacée(s) vers {collection} » apparaît avec Annuler pour l’annuler aussitôt.
• Dans un projet relié à un fichier Figma, la boîte indique « Les calques Figma sont reliés à nouveau lors de la prochaine synchronisation. Tout ce qui ne peut pas être relié est signalé sur la ligne. » Les lignes déplacées portent un badge En attente dans Figma jusqu’à ce que vous appuyiez sur Synchroniser dans le plugin, ce qui crée les variables dans la nouvelle collection côté Figma et reconnecte les calques.

Sélection multiple — deux modes

Sélection de lignes (ligne entière en surbrillance) — pour les opérations par ligne :

• Shift+clic : sélectionne une plage depuis la dernière ligne sélectionnée
• Ctrl(⌘)+clic : ajoute/retire des lignes une à une
• Shift+Ctrl(⌘)+↑↓ : étend au clavier
• Actions disponibles : clic droit Copier (noms et modes inclus) / Dupliquer / Supprimer, la touche Delete, dupliquer avec Shift+Enter, Nouveau groupe avec la sélection, Déplacer vers une collection

Sélection d’une plage de cellules (bordure en pointillés) — pour les opérations de valeurs en masse :

• Cliquez sur une cellule de valeur pour définir l’ancre, puis Shift+clic ou Shift+flèches pour étendre un rectangle
• Actions disponibles : saisie par lots, copie avec Ctrl(⌘)+C, Delete pour vider les valeurs

Saisie par lots

Avec une plage de cellules sélectionnée, commencez simplement à taper — la modification s’ouvre dans la cellule d’ancrage, et Enter place cette valeur dans toutes les cellules sélectionnées à la fois.

Copier-coller

Vous pouvez faire passer des valeurs entre la grille et Google Sheets ou Excel par copier-coller. Collez dans la grille un tableau copié depuis une feuille, et recopiez les valeurs de la grille vers une feuille.

Copier :

• Sélectionnez deux cellules ou plus et appuyez sur Ctrl(⌘)+C pour copier leurs valeurs.
• Sélectionnez des lignes et faites un clic droit sur Copier pour inclure les noms des variables et les modes. Collez-le dans une feuille et vous obtenez un tableau.

Coller (Ctrl(⌘)+V) : collez directement dans la grille un tableau copié depuis un tableur. L’endroit où il atterrit dépend de votre sélection.

• Une cellule de valeur est sélectionnée — le remplissage commence à cette cellule et continue vers la droite et vers le bas. Les lignes et colonnes qui dépassent le bord de la grille sont ignorées.
• Aucune cellule n’est sélectionnée — la première ligne est lue comme un en-tête, et les valeurs sont rapprochées des lignes existantes par nom de variable et nom de mode. Les noms de variables absents de la grille sont créés comme nouvelles lignes (la notification affiche « Nouvelles variables : {count} »). Les colonnes sans correspondance sont ignorées.

Dans les deux cas, une notification indique combien de cellules ont été remplies et combien ont été ignorées. Les cellules qui formeraient une référence circulaire sont ignorées.

Coller sur une cellule de valeur sélectionnée ne remplit que des lignes existantes — pour créer de nouvelles variables en collant, retirez la sélection de cellules et collez un tableau avec une ligne d’en-tête, ou créez d’abord les lignes avec + (Ajouter une variable). Si une recherche ou un filtre est actif, seules les lignes visibles dans la grille sont concernées.

Annuler / Rétablir

Ctrl(⌘)+Z pour annuler, Ctrl(⌘)+Shift+Z pour rétablir (jusqu’à 50 étapes). Des boutons sont aussi disponibles dans la barre d’outils. Les modifications, suppressions, collages, saisies par lots, ainsi que les renommages et déplacements de groupes peuvent tous être annulés.

Gérer les modes (colonnes)

• Ajoutez des modes avec le bouton + (Ajouter un mode) à l’extrémité droite de l’en-tête du dernier mode. À la limite de langues de votre offre, une invitation à passer à l’offre supérieure apparaît.
• Double-cliquez sur l’en-tête d’un mode pour le renommer, ou utilisez Renommer / Supprimer du menu contextuel. Le dernier mode restant ne peut pas être supprimé.
• Faites glisser le bord d’une colonne pour la redimensionner — les largeurs sont conservées pour la prochaine fois.

Rechercher et trier

La barre d’outils comporte un champ de recherche et des filtres de type (Tous les types · Couleur / Chaîne / Nombre / Booléen). Cliquez sur l’en-tête Nom · Description · Tag · Portées pour trier selon cette colonne ; cliquez à nouveau pour inverser le sens. Le tri ne s’applique qu’à l’intérieur de chaque section de groupe — l’ordre des sections de groupe elles-mêmes ne change pas.

Le bouton Affichage — colonnes et couleur de la barre d’outils active ou désactive les colonnes Modes · Description · Tag · Portées (le menu reste ouvert pour en basculer plusieurs) — détaillé dans Métadonnées des variables.

Raccourcis clavier

Graphe des tokens

L’onglet Graphe des tokens d’un projet visualise niveau par niveau les relations de référence (alias) entre variables, et l’onglet Carte des tokens dispose tout le projet en une seule carte. Cliquez sur un token dans le graphe et la synthèse affiche « Modifier ceci affecte {count} » et « Valeurs référencées : {count} », pour voir la portée d’un changement avant de modifier. Depuis la grille, faites un clic droit sur une ligne et choisissez Voir les références pour y aller directement. Voir Graphe des tokens pour le guide complet.

Exporter les données

Exportez directement depuis le web — Exporter dans le menu ⋮ de la carte du projet, ou clic droit sur une collection de la barre latérale ou sur une ligne de la grille, puis Exporter cette collection. Six formats sont disponibles (DTCG · JSON · CSV · CSS · SwiftUI · Jetpack Compose) ; voir Export et code pour les détails. L’option Plus (…) → Exporter du plugin Figma enregistre aussi un fichier. Pour récupérer les design tokens depuis le code ou la CI, utilisez l’API en lecture seule et le serveur MCP.