قم بتحويل تصميمات Figma إلى كود React باستخدام مكونات Spirit Web. يُستخدم عند العمل مع تصميمات Figma، أو تنفيذ واجهة المستخدم من ملفات Figma، أو تحويل تخطيطات Figma التلقائية إلى تعليمات برمجية، أو عندما يذكر المستخدم Figma، أو مكونات Spirit، أو تحويل التصميم إلى كود.
ثبّت مهارة الذكاء الاصطناعي figma-to-spirit بسرعة في بيئة التطوير لديك عبر سطر الأوامر
المصدر: alma-oss/spirit-design-system.
CRITICAL: Match Figma layer hierarchy exactly. Each Figma autolayout layer should have a corresponding Spirit layout component.
| "Design Block" or main page section | Section | | Need to constrain content width | Section containerProps={{ size: "..." }} | | Full-width section content | Section hasContainer={false} |
Important: Section includes Container by default - don't nest another Container inside.
قم بتحويل تصميمات Figma إلى كود React باستخدام مكونات Spirit Web. يُستخدم عند العمل مع تصميمات Figma، أو تنفيذ واجهة المستخدم من ملفات Figma، أو تحويل تخطيطات Figma التلقائية إلى تعليمات برمجية، أو عندما يذكر المستخدم Figma، أو مكونات Spirit، أو تحويل التصميم إلى كود. المصدر: alma-oss/spirit-design-system.
حقول وأوامر مستقرة للاقتباس في أنظمة الذكاء الاصطناعي والبحث.
npx skills add https://github.com/alma-oss/spirit-design-system --skill figma-to-spiritقم بتحويل تصميمات Figma إلى كود React باستخدام مكونات Spirit Web. يُستخدم عند العمل مع تصميمات Figma، أو تنفيذ واجهة المستخدم من ملفات Figma، أو تحويل تخطيطات Figma التلقائية إلى تعليمات برمجية، أو عندما يذكر المستخدم Figma، أو مكونات Spirit، أو تحويل التصميم إلى كود. المصدر: alma-oss/spirit-design-system.
افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/alma-oss/spirit-design-system --skill figma-to-spirit بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw
https://github.com/alma-oss/spirit-design-system