أنشئ أنظمة تصميم قابلة للتطوير باستخدام Tailwind CSS v4 ورموز التصميم ومكتبات المكونات والأنماط سريعة الاستجابة. يُستخدم عند إنشاء مكتبات المكونات، أو تنفيذ أنظمة التصميم، أو توحيد أنماط واجهة المستخدم.
ثبّت مهارة الذكاء الاصطناعي tailwind-design-system بسرعة في بيئة التطوير لديك عبر سطر الأوامر
المصدر: blockmatic/basilic.
Build production-ready design systems with Tailwind CSS v4, including CSS-first configuration, design tokens, component variants, responsive patterns, and accessibility.
Note: This skill targets Tailwind CSS v4 (2024+). For v3 projects, refer to the upgrade guide.
| tailwind.config.ts | @theme in CSS | | @tailwind base/components/utilities | @import "tailwindcss" | | darkMode: "class" | @custom-variant dark (&:where(.dark, .dark )) | | theme.extend.colors | @theme { --color-: value } | | require("tailwindcss-animate") | CSS @keyframes in @theme + @starting-style for entry animations |
أنشئ أنظمة تصميم قابلة للتطوير باستخدام Tailwind CSS v4 ورموز التصميم ومكتبات المكونات والأنماط سريعة الاستجابة. يُستخدم عند إنشاء مكتبات المكونات، أو تنفيذ أنظمة التصميم، أو توحيد أنماط واجهة المستخدم. المصدر: blockmatic/basilic.
حقول وأوامر مستقرة للاقتباس في أنظمة الذكاء الاصطناعي والبحث.
npx skills add https://github.com/blockmatic/basilic --skill tailwind-design-systemأنشئ أنظمة تصميم قابلة للتطوير باستخدام Tailwind CSS v4 ورموز التصميم ومكتبات المكونات والأنماط سريعة الاستجابة. يُستخدم عند إنشاء مكتبات المكونات، أو تنفيذ أنظمة التصميم، أو توحيد أنماط واجهة المستخدم. المصدر: blockmatic/basilic.
افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/blockmatic/basilic --skill tailwind-design-system بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw
https://github.com/blockmatic/basilic