·pencil-design
*

pencil-design

chiroro-jr/pencil-design-skill

Entwerfen Sie Benutzeroberflächen in Pencil (.pen-Dateien) und generieren Sie daraus Produktionscode. Verwenden Sie es, wenn Sie mit .pen-Dateien arbeiten, Bildschirme oder Komponenten in Pencil entwerfen oder Code aus Pencil-Designs generieren. Wird bei Aufgaben ausgelöst, die Pencil, .pen-Dateien, Design-to-Code-Workflows oder UI-Design mit den Pencil MCP-Tools umfassen.

28Installationen·4Trend·@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.

Entwerfen Sie Benutzeroberflächen in Pencil (.pen-Dateien) und generieren Sie daraus Produktionscode. Verwenden Sie es, wenn Sie mit .pen-Dateien arbeiten, Bildschirme oder Komponenten in Pencil entwerfen oder Code aus Pencil-Designs generieren. Wird bei Aufgaben ausgelöst, die Pencil, .pen-Dateien, Design-to-Code-Workflows oder UI-Design mit den Pencil MCP-Tools umfassen. Quelle: chiroro-jr/pencil-design-skill.

Original anzeigen

Fakten (zitierbereit)

Stabile Felder und Befehle für KI/Such-Zitate.

Installationsbefehl
npx skills add https://github.com/chiroro-jr/pencil-design-skill --skill pencil-design
Kategorie
*Kreativität
Verifiziert
Erstes Auftreten
2026-02-11
Aktualisiert
2026-02-18

Schnelle Antworten

Was ist pencil-design?

Entwerfen Sie Benutzeroberflächen in Pencil (.pen-Dateien) und generieren Sie daraus Produktionscode. Verwenden Sie es, wenn Sie mit .pen-Dateien arbeiten, Bildschirme oder Komponenten in Pencil entwerfen oder Code aus Pencil-Designs generieren. Wird bei Aufgaben ausgelöst, die Pencil, .pen-Dateien, Design-to-Code-Workflows oder UI-Design mit den Pencil MCP-Tools umfassen. Quelle: chiroro-jr/pencil-design-skill.

Wie installiere ich pencil-design?

Öffnen Sie Ihr Terminal oder Kommandozeilen-Tool (Terminal, iTerm, Windows Terminal, etc.) Kopieren Sie diesen Befehl und führen Sie ihn aus: npx skills add https://github.com/chiroro-jr/pencil-design-skill --skill pencil-design Nach der Installation wird der Skill automatisch in Ihrer KI-Programmierumgebung konfiguriert und ist bereit zur Verwendung in Claude Code oder Cursor

Wo ist das Quell-Repository?

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

Details

Kategorie
*Kreativität
Quelle
skills.sh
Erstes Auftreten
2026-02-11

Verwandte Skills

Keine