Toutes les ressources premium et membres pour 8,99 €/mois, en abonnement sans engagement. Voir les offres

PalateKit

Se connecter
Menu

Demander une ressource

Décrivez en une phrase la ressource qui vous manque. Nous vous écrirons quand elle sera publiée.

0 / 280

Une page, une vidéo ou une image en ligne.

Débloquer PalateKit

Tout débloquer

Offre

Le paiement vaut acceptation de nos conditions générales de vente.

Paiement sécurisé par Stripe. Reçus et factures envoyés par e-mail.

Content de vous revoir

Connectez-vous pour installer, télécharger ou sauvegarder cette ressource. Un compte gratuit suffit pour les ressources gratuites.

Spécifications de design depuis Figma v1.0.0

Utilisez cette ressource pour extraire les spécifications d'une maquette Figma

Nouveau

  • 524 téléchargements
  • 148 mentions J'aime
  • 157 sauvegardes

Gratuit

Installer avec la CLI

Dans un terminal, depuis le dossier voulu :

npx --yes palatekit@latest install figma-design-spec-extractor

Sans option, la skill va dans ~/.agents/skills/ ; ajoutez --agent claude-code (ou codex, cursor…) pour viser un agent.

Première fois : connectez la CLI avec

npx --yes palatekit@latest login

À partir d'un lien Figma, l'agent récupère la structure du fichier, relève les couleurs, la typographie, les espacements, les bordures et les ombres, puis décrit chaque écran et chaque composant. Vous obtenez un document de spécifications (ou un dossier de preuves pour un PRD) avec les états de survol, de focus et les points d'accessibilité à vérifier.

Choisie surtout par

Mise à jour le 2 novembre 2026

Document de spécifications avec tableaux de couleurs, de typographie et d'espacements tirés d'une maquette.

Caractéristiques

Fonctionne dans
Guides d'installation
Génère avec
Le modèle de votre agent
Utilise
  • Serveur MCP ou plugin Figma
Licence
MIT

Ressources similaires

Tout voir

Ce que vous obtenez

  • SKILL.md : la méthode en quatre phases et les modèles de tableaux, traduit en français
  • references/example-output.md : un exemple de sortie pour un écran de connexion
  • Une liste de contrôle de revue du design et des bonnes pratiques à suivre

Pour qui

  • Vous devez transmettre une maquette Figma à un développeur ou à un agent
  • Vous voulez un inventaire de jetons de design avant une refonte
  • Vous préparez un PRD à partir d'écrans existants

Pas pour qui

  • Générer directement le code des composants
  • Créer une maquette à partir de zéro
  • Concevoir une identité visuelle

Étiquettes

  • figma
  • jetons de design
  • spécifications
  • composants
  • handoff

À propos

Vous dites

« Analyse cette maquette Figma et écris un document de spécifications avec les couleurs, la typographie et les états des boutons : https://www.figma.com/file/... »

Document de spécifications avec tableaux de couleurs, de typographie et d'espacements tirés d'une maquette.

Skill publiée par zhaono1 sous licence MIT, traduite par PalateKit.

Voir plus

Prérequis

À préparer
Le lien du fichier Figma à analyser et Un accès Figma pour l'agent
Dépendances
Serveur MCP ou plugin Figma

Comment l'utiliser

  1. Branchez un serveur MCP Figma à votre agent et copiez la skill dans son répertoire de skills.
  2. Donnez le lien du fichier ou de l'écran Figma à analyser.
  3. Relisez le document de spécifications et listez les questions de design restées ouvertes.

Aperçu du contenu

Fichiers

  • LICENSE1,1 Ko
  • NOTICE-PALATEKIT.md0,4 Ko
  • references/example-output.md1,5 Ko
  • SKILL.md11,3 Ko

Origine et licence

Modifié par PalateKit

Auteur
zhaono1
Source
github.com/zhaono1/agent-playbook/tree/be7a9d7d17593abd8cf029d51c87dbd5b445351e/skills/figma-designer
Licence
MIT

Notice

Version modifiée de « figma-designer » (zhaono1, MIT) : traduction française et fiche par PalateKit.

Avis des utilisateurs

–

Aucune note pour l'instant

Chargement des avis…

Supprimer votre avis ?

Votre note et votre commentaire seront retirés de la fiche.

Questions fréquentes

Faut-il un accès à Figma ?

Oui : l'agent a besoin d'un serveur MCP ou d'un plugin Figma pour lire le fichier. Sans cela, vous pouvez lui fournir des captures d'écran, avec moins de précision.

Que sont les « hooks » de l'en-tête ?

Ce sont des suggestions de passage à d'autres skills (PRD, journal). Elles sont facultatives et la skill fonctionne sans elles.