·design-builder
*

design-builder

Pipeline de conception à code : extrayez la copie des URL, extrayez les jetons de conception des images, puis créez des composants React ou des variantes d'aperçu HTML. À utiliser lors de : l'extraction de contenu de sites Web, l'extraction de systèmes de conception, la génération de code frontal, la prévisualisation de variantes de conception, l'envoi à Figma via MCP. À utiliser également lorsque l'utilisateur souhaite créer une page à partir d'une URL de référence ou d'une capture d'écran, reconcevoir un site existant, créer des prototypes visuels ou générer du code à partir d'une conception. Déclencheurs sur "extraire la copie", "extraire la conception", "construire l'interface", "générer des variantes", "exporter la conception", "envoyer à Figma", "construire à partir d'une référence", "reconcevoir ceci", "créer un prototype".

19Installations·1Tendance·@adeonir

Installation

$npx skills add https://github.com/adeonir/agents-skills --skill design-builder

Comment installer design-builder

Installez rapidement le skill IA design-builder dans votre environnement de développement via la ligne de commande

  1. Ouvrir le Terminal: Ouvrez votre terminal ou outil de ligne de commande (Terminal, iTerm, Windows Terminal, etc.)
  2. Exécuter la commande d'installation: Copiez et exécutez cette commande : npx skills add https://github.com/adeonir/agents-skills --skill design-builder
  3. Vérifier l'installation: Une fois installé, le skill sera automatiquement configuré dans votre environnement de programmation IA et prêt à être utilisé dans Claude Code, Cursor ou OpenClaw

Source : adeonir/agents-skills.

Each step is independent. Can run isolated or chained. Discovery is always the first step -- never skip it.

If found: read and extract purpose, audience, tone, and key features. Skip to the relevant trigger operation.

If the user answers "I don't know" to any question, mark as TBD and move forward. Summarize understanding before proceeding.

Pipeline de conception à code : extrayez la copie des URL, extrayez les jetons de conception des images, puis créez des composants React ou des variantes d'aperçu HTML. À utiliser lors de : l'extraction de contenu de sites Web, l'extraction de systèmes de conception, la génération de code frontal, la prévisualisation de variantes de conception, l'envoi à Figma via MCP. À utiliser également lorsque l'utilisateur souhaite créer une page à partir d'une URL de référence ou d'une capture d'écran, reconcevoir un site existant, créer des prototypes visuels ou générer du code à partir d'une conception. Déclencheurs sur "extraire la copie", "extraire la conception", "construire l'interface", "générer des variantes", "exporter la conception", "envoyer à Figma", "construire à partir d'une référence", "reconcevoir ceci", "créer un prototype". Source : adeonir/agents-skills.

Faits (prêts à citer)

Champs et commandes stables pour les citations IA/recherche.

Commande d'installation
npx skills add https://github.com/adeonir/agents-skills --skill design-builder
Catégorie
*Créativité
Vérifié
Première apparition
2026-02-28
Mis à jour
2026-03-11

Browse more skills from adeonir/agents-skills

Réponses rapides

Qu'est-ce que design-builder ?

Pipeline de conception à code : extrayez la copie des URL, extrayez les jetons de conception des images, puis créez des composants React ou des variantes d'aperçu HTML. À utiliser lors de : l'extraction de contenu de sites Web, l'extraction de systèmes de conception, la génération de code frontal, la prévisualisation de variantes de conception, l'envoi à Figma via MCP. À utiliser également lorsque l'utilisateur souhaite créer une page à partir d'une URL de référence ou d'une capture d'écran, reconcevoir un site existant, créer des prototypes visuels ou générer du code à partir d'une conception. Déclencheurs sur "extraire la copie", "extraire la conception", "construire l'interface", "générer des variantes", "exporter la conception", "envoyer à Figma", "construire à partir d'une référence", "reconcevoir ceci", "créer un prototype". Source : adeonir/agents-skills.

Comment installer design-builder ?

Ouvrez votre terminal ou outil de ligne de commande (Terminal, iTerm, Windows Terminal, etc.) Copiez et exécutez cette commande : npx skills add https://github.com/adeonir/agents-skills --skill design-builder Une fois installé, le skill sera automatiquement configuré dans votre environnement de programmation IA et prêt à être utilisé dans Claude Code, Cursor ou OpenClaw

Où se trouve le dépôt source ?

https://github.com/adeonir/agents-skills

Détails

Catégorie
*Créativité
Source
skills.sh
Première apparition
2026-02-28