prompt
مواصفة مكون نظام التصميم
يحدد مواصفة مكون واجهة بمتغيراته وحالاته واحجامه وقواعد استخدامه لنظام تصميم.
اكتب مواصفة مكون ل{{component}} في نظام تصميم. غط متغيراته ({{variants}})، والحالات التفاعلية (افتراضي، تحويم، تركيز، نشط، معطل)، وخيارات الحجم، وقواعد التباعد والمحاذاة، وملاحظات الوصولية، وافعل واحدا ولا تفعل واحدا للاستخدام. اجعله جاهزا للتنفيذ.
المتغيرات
componentالمكونvariantsالمتغيراتمثال للمخرجات
المكون: زر. المتغيرات: رئيسي، ثانوي، شبحي، مدمر. الحالات — افتراضي: تعبئة صلبة؛ تحويم: اغمق 8%؛ تركيز: حد 2 بكسل بازاحة لمستخدمي لوحة المفاتيح؛ نشط: اغمق 12%؛ معطل: شفافية 40% دون مؤشر. الحجم: صغير 32 بكسل، متوسط 40، كبير 48 ارتفاعا، بحشوة افقية 12/16/20 بكسل. التباعد: 8 بكسل حد ادنى بين الازرار المتجاورة؛ وفجوة الايقونة والنص 8 بكسل. الوصولية: النص حقيقي لا صورة، وحلقة التركيز ظاهرة دائما، وهدف اللمس 44 بكسل على الاقل. افعل: زر رئيسي واحد لكل عرض. لا تفعل: الاعتماد على اللون وحده للمتغير المدمر — اضف ايقونة او نصا واضحا.
التفاصيل
المصدر
AI Khazna
الرخصة
—
الأمان
موثوق
النوع
prompt
أصول ذات صلة
مختارات أخرى في التصميم والإبداع.
git clone https://github.com/anthropics/skills && cp -r skills/skills/canvas-design ~/.claude/skills/
git clone https://github.com/anthropics/skills && cp -r skills/skills/web-artifacts-builder ~/.claude/skills/
git clone https://github.com/anthropics/skills && cp -r skills/skills/slack-gif-creator ~/.claude/skills/
يفحص ازواج الالوان مقابل قواعد تباين WCAG ويقترح اصلاحات يمكن الوصول اليها.
تصيير معماري واقعي — واجهات وداخليات وسياق حضري.
يكيف لوحة الوان الوضع الفاتح الى لوحة وضع داكن وصولة برموز الاسطح والنص.
افحص قبل التثبيت
شغل أي مصدر عبر فحوصاتنا - الظهور في الذكاء الاصطناعي والأمان والأداء واكتشاف التقنيات.
فحص أمني تلقائي للموقع
الأمان
محلل سرعة الصفحة
الأداء
اختبار جودة المحتوى العربي بالذكاء الاصطناعي
جودة المحتوى
مختبر وكلاء الذكاء الاصطناعي
اختبار الذكاء الاصطناعي
كاشف منصة الموقع
الترحيل
تدقيق الظهور في محركات الذكاء الاصطناعي
الظهور في الذكاء الاصطناعي
مولد ملف llms.txt
الظهور في الذكاء الاصطناعي
مقياس سهولة القراءة بالعربية
جودة المحتوى
منشئ البيانات المنظمة
الظهور في الذكاء الاصطناعي
حاسبة تكاليف الذكاء الاصطناعي
اختبار الذكاء الاصطناعي
محلل العناوين العربية
جودة المحتوى