المهارات tailwind-design-system
📦

tailwind-design-system

مراجعة المحتوى r2 آمن ⚙️ الأوامر الخارجية

بناء أنظمة تصميم Tailwind

غالبا ما تواجه الفرق صعوبة في الحفاظ على اتساق واجهات Tailwind عبر المنتجات. توفر هذه المهارة أنماطا قابلة لإعادة الاستخدام للرموز، والمكونات، والتخطيط، والسمات، وإمكانية الوصول.

يدعم: Claude Codex Code(CC)
🥉 78 برونزي

التثبيت باستخدام Agent لدي

انسخ هذا الطلب إلى Agent لديك. يتضمن صفحة Skill المعتمدة وملف manifest.

طلب الوكيل
Review the Skillstore skill "tailwind-design-system" from https://skillstore.io/skills/sickn33-tailwind-design-system.md and its manifest at https://skillstore.io/api/skills/sickn33-tailwind-design-system/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

يجب أن يواصل Agent عرض خطته وطلب أي تأكيد تفرضه سياسة الأمان.

موارد مهيّأة لـ Agents

استخدم هذه الروابط عندما يحتاج AI Agent أو crawler أو script إلى سياق نظيف بدلًا من قراءة الصفحة كاملة.

تفاصيل Markdown GET /skills/sickn33-tailwind-design-system.md manifest موقَّع GET /api/skills/sickn33-tailwind-design-system/manifest lockfile موقَّع GET /api/skills/sickn33-tailwind-design-system/lockfile

اختبرها

جارٍ استخدام "tailwind-design-system". خطط لنظام رموز Tailwind للوحة تحكم SaaS.

النتيجة المتوقعة:

  • مجموعات ألوان دلالية للخلفية، والمقدمة، والأساسي، والثانوي، والمكتوم، والتمييز، والحدود، وحالات الحلقة.
  • متغيرات الوضع الداكن التي تعكس أسماء الرموز نفسها.
  • إرشادات نصف القطر والتباعد لتحقيق كثافة مكونات متسقة.

جارٍ استخدام "tailwind-design-system". وحّد الأزرار والبطاقات المتكررة.

النتيجة المتوقعة:

  • جرد للمكونات مصنف حسب الغرض، والمتغير، والحجم، والحالة.
  • توصيات لتسمية المتغيرات المشتركة والحالات الافتراضية.
  • فحوصات إمكانية الوصول لحلقات التركيز، والحالات المعطلة، والتباين المقروء.

جارٍ استخدام "tailwind-design-system". حسّن التخطيطات المتجاوبة في منتج قائم.

النتيجة المتوقعة:

  • أحجام حاويات مطابقة لأنواع الصفحات الشائعة.
  • قواعد شبكة لتخطيطات ذات عمودين، وثلاثة أعمدة، وأربعة أعمدة، وستة أعمدة.
  • ملاحظات مراجعة للتباعد، والالتفاف، وقابلية القراءة على الأجهزة المحمولة.

التدقيق الأمني

آمن
v5 • ٦‏/٩‏/٢٠٢٦ فتح التقرير المرتبط بالإصدار

All nine static findings are false positives caused by TypeScript syntax, Markdown backticks, and ordinary design-system examples. No executable shell behavior, system reconnaissance, prompt injection, exfiltration intent, or other semantic security risk was found.

2
الملفات التي تم فحصها
708
الأسطر التي تم تحليلها
0
عناصر المراجعة
0
تم تجاهل الإيجابيات الكاذبة

عوامل الخطر

⚙️ الأوامر الخارجية (4)
resources/implementation-playbook.md:310-315 resources/implementation-playbook.md:315-381 SKILL.md:32 SKILL.md:36
لم يكتشف أحدث تدقيق ثابت ودلالي مكتمل أي نتائج أمنية مؤكدة. ولا يثبت ذلك أن المهارة خالية من الآثار الجانبية.
دقّقه: codex عرض سجل التدقيق →
شارك واستشهد بهذا التقرير

شارك تقرير التقييم المرتبط بالإصدار والشارة المحايدة وبطاقة التضمين والاستشهادات. تعرض Skillstore الأدلة من دون أن تقرر ما إذا كانت هذه المهارة آمنة.

فتح التقرير المرتبط بالإصدار
تقييم الأمان

نسخ رابط التقرير

https://skillstore.io/skills/sickn33-tailwind-design-system/audits/5?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

شارة Markdown

[![Skillstore security assessment](https://skillstore.io/badges/skills/sickn33-tailwind-design-system/security.svg)](https://skillstore.io/skills/sickn33-tailwind-design-system?utm_source=security_passport_badge)

شارة HTML

<a href="https://skillstore.io/skills/sickn33-tailwind-design-system?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/sickn33-tailwind-design-system/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

بطاقة قابلة للتضمين

<iframe src="https://skillstore.io/embed/skills/sickn33-tailwind-design-system.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>
الاستشهادات الأكاديمية (APA · BibTeX · CFF)

اقتباس APA

sickn33. (2026). tailwind-design-system security audit report (audit version 5) [Author version unspecified]. Skillstore. https://skillstore.io/skills/sickn33-tailwind-design-system/audits/5

اقتباس BibTeX

@techreport{sickn33-sickn33-tailwind-design-system-2026, author = {sickn33}, title = {tailwind-design-system security audit report (audit version 5)}, institution = {Skillstore}, year = {2026}, number = {5}, url = {https://skillstore.io/skills/sickn33-tailwind-design-system/audits/5}, note = {Author version unspecified} }

CITATION.cff

cff-version: 1.2.0 message: "If you use this Skill, cite its author and this versioned security audit report." title: "tailwind-design-system security audit report (audit version 5)" version: "unspecified" type: report authors: - name: "sickn33" date-released: "2026-09-06" url: "https://skillstore.io/skills/sickn33-tailwind-design-system/audits/5" identifiers: - type: other value: "skillstore:sickn33-tailwind-design-system:audit:5" description: "Skillstore immutable audit report identifier"

مقارنة المتغيرات

2 متغيرات قابلة للتثبيت

تبقى مهارة كل مؤلف عنصراً مستقلاً قابلاً للتثبيت. يُرتب المتغير الموصى به وفق أدلة Skillstore.

سبب تصدر هذا المتغير

أعلى تقييم في Skillstore
sickn33 موصى به الحالي

sickn33-tailwind-design-system

تقييم Skillstore 78
موثوقية الأدلة مرتفع
استخدام Skillstore 20
تم التحديث

2026-09-09

wshobson

wshobson-tailwind-design-system

تقييم Skillstore 77
موثوقية الأدلة مرتفع
استخدام Skillstore 20
تم التحديث

2026-09-09

تقييم Skillstore

سبب هذا التقييم موثوقية الأدلة: مرتفع
55
الهندسة المعمارية
85
قابلية الصيانة
87
المحتوى
69
المجتمع
83
الامتثال للمواصفات

ما الذي يمكنك بناؤه

أساس نظام التصميم

خطط للرموز الدلالية، ومتغيرات الوضع الداكن، وأعراف Tailwind القابلة لإعادة الاستخدام لواجهة منتج جديدة.

توحيد مكتبة المكونات

حوّل ترميز Tailwind المتكرر إلى مكونات مكتوبة قابلة لإعادة الاستخدام مع متغيرات وحالات متسقة.

تنظيف واجهة مستخدم متجاوبة

حسّن اتساق التخطيط باستخدام أنماط الحاويات، والشبكات، والتباعد، وإمكانية الوصول عبر الشاشات الحالية.

جرّب هذه الموجّهات

رسم خريطة رموز التصميم 
Use the Tailwind design system skill to propose semantic color, spacing, radius, and dark mode tokens for my app.
إنشاء متغيرات المكونات 
Use the Tailwind design system skill to design button, input, card, and label variants for a React TypeScript component library.
توحيد التخطيطات المتجاوبة 
Use the Tailwind design system skill to define responsive container and grid patterns for dashboard, marketing, and form pages.
إعادة هيكلة نظام واجهة مستخدم قائم 
Use the Tailwind design system skill to audit my current Tailwind components and create a migration plan for tokens, variants, themes, and accessibility.

أفضل الممارسات

  • استخدم الرموز الدلالية قبل أصناف Tailwind الخاصة بالمكونات.
  • حافظ على متغيرات المكونات مكتوبة، ومركزية، وموثقة.
  • تحقق من حالات التركيز، وسلوك ARIA، والتباين، والوضع الداكن معا.

تجنب

  • ترميز ألوان العلامة التجارية مباشرة داخل كل مكون.
  • إضافة قيم عشوائية لاختيارات التخطيط الشائعة.
  • نسخ المكونات النموذجية دون تكييفها مع أعراف المشروع.

الأسئلة المتكررة

هل تنشئ هذه المهارة نظام تصميم كاملا؟
توفر أنماطا وأمثلة وإرشادات تنفيذ. ما زلت أنت تختار الرموز النهائية، والمكونات، ومعايير المراجعة.
هل يمكنها العمل مع Claude وCodex وClaude Code؟
نعم. يذكر التقرير دعما لـ Claude وCodex وClaude Code.
ما أطر العمل التي تفترضها؟
تركز الأمثلة على React وTypeScript وTailwind CSS وCVA وأنماط Radix ومساعدات الأدوات الشائعة.
هل تتضمن إرشادات إمكانية الوصول؟
نعم. تغطي حلقات التركيز، ورسائل أخطاء ARIA، والتسميات، والحالات المعطلة، وبنية المكونات الملائمة للوحة المفاتيح.
هل يمكنها المساعدة في الوضع الداكن؟
نعم. تتضمن سمات CSS variable، ونمط موفر السمة، ونمط تبديل السمة.
هل ستعدّل الكود الخاص بي تلقائيا؟
لا. إنها مهارة تعليمية ترشد التنفيذ والمراجعة.

تفاصيل المطور

المؤلف

sickn33

الترخيص

MIT

مراجعة Skillstore

r2

تنبيه الإصدار

لم يعلن المؤلف عن إصدار.

المستودع

https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/tailwind-design-system

مرجع

ae6ba0f1a47f0b4427a656b2202f2ff34bfea6be

حداثة الصيانة

٦‏/٩‏/٢٠٢٦

الاستخدام

19 تنزيلات · 126 مشاهدات

بنية الملفات

📁 resources/

📄 implementation-playbook.md

📄 SKILL.md

المزيد من sickn33

عرض الكل

مهارات ذات صلة

عرض الكل
📦

ux-designer

80

حسّن تجربة المستخدم بإرشادات تصميم قائمة على البحث

بواسطة shubhamsaboo

غالبًا ما تصمم الفرق المسارات بناءً على افتراضات وتفوتها مشكلات إمكانية الوصول. ترشد هذه المهارة البحث، والبنية، وتصميم التفاعل، والمراجعة باستخدام أفضل ممارسات تجربة المستخدم.

التصميم والإبداع عرض
📦

web-accessibility

82

تدقيق إمكانية الوصول إلى الويب للامتثال لمعايير WCAG

بواسطة 89jobrien

يمكن أن تمنع فجوات إمكانية الوصول المستخدمين من الاستفادة من الخدمة وأن تخلق مخاطر امتثال. ترشد هذه المهارة عمليات تدقيق WCAG، وفحوصات قارئ الشاشة، واختبار لوحة المفاتيح، وتخطيط المعالجة.

التصميم والإبداع عرض