| Button | --color-primary, --space-2/4, --radius-md, --text-sm | | Input | --color-border, --space-2/3, --radius-md, --text-base | | Card | --color-surface, --space-4, --radius-lg, --shadow-md | | Badge | --color-, --space-1/2, --radius-full, --text-xs |
تصميم نظام الرموز باستخدام خصائص CSS المخصصة للتصميم المتسق. يُستخدم لإنشاء لوحات الألوان، ومقاييس التباعد، وأنظمة الطباعة، والسمات (الوضع الداكن/الفاتح). يتم تشغيلها بناءً على طلبات رموز التصميم، أو متغيرات CSS، أو السمات، أو أنظمة الألوان، أو مقاييس التباعد، أو التصميم المتسق. المصدر: ibutters/claudecodeplugins.
افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/ibutters/claudecodeplugins --skill css-tokens بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw