أكثر من 30 مكوناً (Components) يغطي جميع مكونات MD3 الأساسية والمتقدمة، مع عناصر HTML/JSX الخاصة بها وطرق استيرادها وأكواد أمثلة.
🏷️ نظام رموز التصميم (Design Tokens) يدير جميع متغيرات التصميم مثل الألوان (29 دوراً لونياً) ، الطباعة، الأشكال، والارتفاعات.
🎭 إنشاء الثيمات يمكنه توليد نظام ألوان كامل من لون بذري واحد (Seed Color)، مع دعم الوضع الداكن والفاتح.
📱 تصميم متجاوب يتضمن 5 نقاط قطع (Breakpoints)، 3 تخطيطات أساسية، وإرشادات كاملة للشاشات الكبيرة والقابلة للطي.
✅ تدقيق الامتثال (Compliance Audit) ميزة فريدة يمكنها تحليل كود أو موقع مباشر وإعطائه درجة توافق مع MD3 عبر 10 فئات، مع تقرير مفصل بالتحسينات المطلوبة.
🔄 دعم المنصات يوفر إرشادات للويب (@material/web)، Flutter، و Jetpack Compose.
✨ تحديثات MD3 التعبيرية (M3 Expressive) يغطي آخر تحديثات مايو 2025 مثل الحركات النابضة (Spring Motion) ، الطباعة المركزة، وتحويل الأشكال.
المتطلبات: تحتاج إلى Claude Code (من Anthropic) مثبتاً.
التثبيت:
```bash
git clone https://github.com/hamen/material-3-skill.git
# نسخ المجلد إلى مهارات Claude Code
cp -r material-3-skill ~/.claude/skills/material-3
# أو عمل رابط رمزي (symlink) للتحديثات السهلة
ln -s /path/to/material-3-skill ~/.claude/skills/material-3
```
هذا المشروع هو الجسر المثالي بين قوة نماذج الذكاء الاصطناعي في توليد الأكواد، ودقة واتساق أنظمة التصميم الاحترافية مثل Material Design 3. هو أداة لا غنى عنها للمطورين الذين يستخدمون Claude Code لبناء تطبيقات ويب او موبايل متوافقة مع معايير Google.
https://github.com/hamen/material-3-skill/




























