pencil-design

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.

تصميم واجهات المستخدم في Pencil (ملفات .pen) وإنشاء كود الإنتاج منها. يُستخدم عند العمل باستخدام ملفات ‎.pen، أو تصميم الشاشات أو المكونات في Pencil، أو إنشاء تعليمات برمجية من تصميمات Pencil. تشغيل المهام التي تتضمن Pencil أو ملفات .pen أو سير عمل التصميم إلى التعليمات البرمجية أو تصميم واجهة المستخدم باستخدام أدوات Pencil MCP. المصدر: chiroro-jr/pencil-design-skill.