أنماط مكونات shadcn/ui مع أساسيات Radix وتصميم Tailwind. يُستخدم عند إنشاء مكونات واجهة المستخدم، أو استخدام متغيرات CVA، أو تنفيذ المكونات المركبة، أو التصميم باستخدام سمات فتحة البيانات. المشغلات على shadcn، وcva، وcn()، وفتحة البيانات، وRadix، والزر، والبطاقة، والحوار، وVariantProps.
ثبّت مهارة الذكاء الاصطناعي shadcn-ui بسرعة في بيئة التطوير لديك عبر سطر الأوامر
المصدر: existential-birds/beagle.
Tokens: bg-background, text-foreground, bg-primary, text-primary-foreground, bg-card, text-card-foreground, border-input, text-muted-foreground
| Multiple visual variants (primary, outline, ghost) | Yes | Plain className | | Size variations (sm, md, lg) | Yes | Plain className | | Compound conditions (outline + large = thick border) | Yes | Conditional cn() | | One-off custom styling | No | className prop | | Dynamic colors from props | No | Inline styles or CSS variables |
| Complex UI with multiple semantic parts | Yes | Single component with many props | | Optional sections (header, footer) | Yes | Boolean show/hide props | | Different styling for each part | Yes | CSS selectors | | Shared state between parts | Yes + Context | Props drilling | | Simple wrapper with children | No | Single component |
حقول وأوامر مستقرة للاقتباس في أنظمة الذكاء الاصطناعي والبحث.
npx skills add https://github.com/existential-birds/beagle --skill shadcn-uiأنماط مكونات shadcn/ui مع أساسيات Radix وتصميم Tailwind. يُستخدم عند إنشاء مكونات واجهة المستخدم، أو استخدام متغيرات CVA، أو تنفيذ المكونات المركبة، أو التصميم باستخدام سمات فتحة البيانات. المشغلات على shadcn، وcva، وcn()، وفتحة البيانات، وRadix، والزر، والبطاقة، والحوار، وVariantProps. المصدر: existential-birds/beagle.
افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/existential-birds/beagle --skill shadcn-ui بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw
https://github.com/existential-birds/beagle