تصدير تصميم .pen إلى كود React/Tailwind. يفعل شيئا واحدا جيدا. الإدخال: معرف إطار القلم أو مسار الملف الإخراج: كود مكون التفاعل + تكوين Tailwind يُستخدم عندما: استكشاف التصميم أو يحتاج المستخدم إلى رمز التنفيذ من تصميم قلم الرصاص النهائي.
ثبّت مهارة الذكاء الاصطناعي pencil-to-code بسرعة في بيئة التطوير لديك عبر سطر الأوامر
المصدر: phrazzld/claude-config.
| frame with layout | | | frame with children | Component with children | | text | , , or | | ref (instance) | Reusable component | | rectangle | with fill | | ellipse | | | image | or fill: url() |
تصدير تصميم .pen إلى كود React/Tailwind. يفعل شيئا واحدا جيدا. الإدخال: معرف إطار القلم أو مسار الملف الإخراج: كود مكون التفاعل + تكوين Tailwind يُستخدم عندما: استكشاف التصميم أو يحتاج المستخدم إلى رمز التنفيذ من تصميم قلم الرصاص النهائي. المصدر: phrazzld/claude-config.
افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/phrazzld/claude-config --skill pencil-to-code بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw
حقول وأوامر مستقرة للاقتباس في أنظمة الذكاء الاصطناعي والبحث.
npx skills add https://github.com/phrazzld/claude-config --skill pencil-to-codeتصدير تصميم .pen إلى كود React/Tailwind. يفعل شيئا واحدا جيدا. الإدخال: معرف إطار القلم أو مسار الملف الإخراج: كود مكون التفاعل + تكوين Tailwind يُستخدم عندما: استكشاف التصميم أو يحتاج المستخدم إلى رمز التنفيذ من تصميم قلم الرصاص النهائي. المصدر: phrazzld/claude-config.
افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/phrazzld/claude-config --skill pencil-to-code بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw
https://github.com/phrazzld/claude-config