أنماط Tailwind CSS جاهزة للإنتاج لمكونات مواقع الويب الشائعة: التخطيطات سريعة الاستجابة، والبطاقات، والتنقل، والنماذج، والأزرار، والطباعة. يتضمن مقياس التباعد ونقاط التوقف وأنماط الهاتف المحمول أولاً ودعم الوضع المظلم. يُستخدم عند إنشاء مكونات واجهة المستخدم، أو إنشاء الصفحات المنتقل إليها، أو نماذج التصميم، أو تنفيذ التنقل، أو إصلاح التخطيطات سريعة الاستجابة.
ثبّت مهارة الذكاء الاصطناعي tailwind-patterns بسرعة في بيئة التطوير لديك عبر سطر الأوامر
المصدر: jezweb/claude-skills.
Status: Production Ready ✅ Last Updated: 2026-01-14 Tailwind Compatibility: v3.x and v4.x Source: Production projects, shadcn/ui patterns
| Tight spacing | gap-2 p-2 space-y-2 | 0.5rem (8px) | | Standard spacing | gap-4 p-4 space-y-4 | 1rem (16px) | | Comfortable | gap-6 p-6 space-y-6 | 1.5rem (24px) | | Loose | gap-8 p-8 space-y-8 | 2rem (32px) | | Section spacing | py-16 sm:py-24 | 4rem/6rem (64px/96px) |
Standard Pattern: Use increments of 4 (4, 6, 8, 12, 16, 24)
أنماط Tailwind CSS جاهزة للإنتاج لمكونات مواقع الويب الشائعة: التخطيطات سريعة الاستجابة، والبطاقات، والتنقل، والنماذج، والأزرار، والطباعة. يتضمن مقياس التباعد ونقاط التوقف وأنماط الهاتف المحمول أولاً ودعم الوضع المظلم. يُستخدم عند إنشاء مكونات واجهة المستخدم، أو إنشاء الصفحات المنتقل إليها، أو نماذج التصميم، أو تنفيذ التنقل، أو إصلاح التخطيطات سريعة الاستجابة. المصدر: jezweb/claude-skills.
حقول وأوامر مستقرة للاقتباس في أنظمة الذكاء الاصطناعي والبحث.
npx skills add https://github.com/jezweb/claude-skills --skill tailwind-patternsأنماط Tailwind CSS جاهزة للإنتاج لمكونات مواقع الويب الشائعة: التخطيطات سريعة الاستجابة، والبطاقات، والتنقل، والنماذج، والأزرار، والطباعة. يتضمن مقياس التباعد ونقاط التوقف وأنماط الهاتف المحمول أولاً ودعم الوضع المظلم. يُستخدم عند إنشاء مكونات واجهة المستخدم، أو إنشاء الصفحات المنتقل إليها، أو نماذج التصميم، أو تنفيذ التنقل، أو إصلاح التخطيطات سريعة الاستجابة. المصدر: jezweb/claude-skills.
افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/jezweb/claude-skills --skill tailwind-patterns بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw
https://github.com/jezweb/claude-skills