·pencil-design
*

pencil-design

chiroro-jr/pencil-design-skill

Concevez des interfaces utilisateur dans Pencil (fichiers .pen) et générez du code de production à partir d'elles. À utiliser lorsque vous travaillez avec des fichiers .pen, concevez des écrans ou des composants dans Pencil ou générez du code à partir de conceptions Pencil. Se déclenche sur des tâches impliquant Pencil, des fichiers .pen, des flux de travail de conception à code ou la conception d'interface utilisateur avec les outils Pencil MCP.

28Installations·4Tendance·@chiroro-jr

Installation

$npx skills add https://github.com/chiroro-jr/pencil-design-skill --skill pencil-design

SKILL.md

Design production-quality UIs in Pencil and generate clean, maintainable code from them. This skill enforces best practices for design system reuse, variable usage, layout correctness, visual verification, and design-to-code workflows.

These rules address the most common agent mistakes. Violating them produces designs that are inconsistent, hard to maintain, and generate poor code.

NEVER recreate a component from scratch when one already exists in the design file.

Concevez des interfaces utilisateur dans Pencil (fichiers .pen) et générez du code de production à partir d'elles. À utiliser lorsque vous travaillez avec des fichiers .pen, concevez des écrans ou des composants dans Pencil ou générez du code à partir de conceptions Pencil. Se déclenche sur des tâches impliquant Pencil, des fichiers .pen, des flux de travail de conception à code ou la conception d'interface utilisateur avec les outils Pencil MCP. Source : chiroro-jr/pencil-design-skill.

Voir l'original

Faits (prêts à citer)

Champs et commandes stables pour les citations IA/recherche.

Commande d'installation
npx skills add https://github.com/chiroro-jr/pencil-design-skill --skill pencil-design
Catégorie
*Créativité
Vérifié
Première apparition
2026-02-11
Mis à jour
2026-02-18

Réponses rapides

Qu'est-ce que pencil-design ?

Concevez des interfaces utilisateur dans Pencil (fichiers .pen) et générez du code de production à partir d'elles. À utiliser lorsque vous travaillez avec des fichiers .pen, concevez des écrans ou des composants dans Pencil ou générez du code à partir de conceptions Pencil. Se déclenche sur des tâches impliquant Pencil, des fichiers .pen, des flux de travail de conception à code ou la conception d'interface utilisateur avec les outils Pencil MCP. Source : chiroro-jr/pencil-design-skill.

Comment installer pencil-design ?

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/chiroro-jr/pencil-design-skill --skill pencil-design Une fois installé, le skill sera automatiquement configuré dans votre environnement de programmation IA et prêt à être utilisé dans Claude Code ou Cursor

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

https://github.com/chiroro-jr/pencil-design-skill

Détails

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

Skills Connexes

Aucun