مصدر مفتوح. آفاق جديدة.

ديمبراندت أداة سطر أوامر تعتمد على نود.جس ترسم الموقع عبر بلايررايت وتقرأ الأنماط المحسوبة من الـ DOM وتحوّل الألوان والخطوط والمسافات والحدود والظلال والحركة والمكونات إلى رموز تصميم W3C مع مراقبة الانحراف في بيئة CI ودعم MCP.

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

نظام تصميم Priceline هو مكتبة مكونات واجهة المستخدم مفتوحة المصدر ونظام التصميم الرسمي لشركة Priceline.com. يهدف إلى توحيد أنماط الواجهات، وتسريع التصاميم والتطوير، وتعزيز إمكانية الوصول والذكاء الدولي والتصميم المتجاوب. يُنشر كحزمة npm.

Chromatic هي أداة بناء لإدارة أنظمة التصميم متعددة المنصات من ملفات design-token. تدعم التعبيرات المرنة، والسمات (themes)، ومدخلات YAML/JSON، وتنتج مخرجات بتنسيقات Sass وCSS وiOS وAndroid ودليل أنماط HTML.

نظام تصميم هيلسنكي (HDS) هو نظام تصميم مفتوح المصدر من مدينة هيلسنكي، يقدم مكونات React ورسائل CSS ورموز التصميم، بالإضافة إلى التوثيق والموارد التصميمية.

مجموعة من 120 ملف DESIGN.md تحتوي على مواصفات تصميم العلامات التجارية، تم استخراجها من مواقع الإنتاج الفعلية لتمكين وكلاء الذكاء الاصطناعي من توليد واجهات مستخدم متسقة مع هوية كل علامة.

TW Elements هي مكتبة مكونات مرخصة بموجب MIT لـ Tailwind CSS، توفر أكثر من 500 مكون واجهة مستخدم تفاعلي و117+ كتلة تصميم مع دعم الوضع الداكن وخيارات التخصيص وتثبيت سريع للاستخدام الشخصي والتجاري.

Radix Themes هي مكتبة مكونات React مفتوحة المصدر تركز على السرعة والصيانة وسهولة الوصول، تُدار بواسطة WorkOS وتحت ترخيص MIT.

توفر Zag آلات حالات عديمة الرؤوس ومنفصلة عن الأطر البرمجية لمكونات واجهة المستخدم المتاحة في JavaScript، مع محولات لـ React وSolid وVue وSvelte وواجهات برمجية غير مصممة لبناء نظام تصميم خاص بك.

Ant Design هي لغة تصميم واجهة مستخدم من الفئة المؤسسية ومكتبة مكونات React مكتوبة بلغة TypeScript، توفر مكونات عالية الجودة، وموارد تصميم، ودعماً للتخصيص والتدويل.

مجموعة مختارة باللغة الإنجليزية من الإشارات المرجعية والموارد والمقالات والأدوات حول أنظمة التصميم للمطورين، تغطي أدوات التصميم، وDesign tokens، ومكتبات الأنماط، واختبار المكونات، والكتب، والمحاضرات.

مجموعة من سبع مكتبات مهارات لوكلاء الترميز بالذكاء الاصطناعي، تغطي تنظيف الرمز، تحرير النثر، تنسيق الوكيل المتوازي، تصميم الواجهة، ملاحظات المنتج، بحث التصميم، وضمان الجودة. تعمل مع Claude Code، Cursor، Codex، وغيرها من الوكلاء الذين يقرؤون ملفات المهارات.

يقوم Tinte بتجميع نظام تصميم إلى Agent Plugin، حيث يستخرج الهوية من مرجع، ويصدر ملف SKILL.md وtokens.css، ويقوم بفحص الألوان التي تتجاوز الرموز. كما ينتج نفس الإعداد مسبقات shadcn وثيمات المحرر ومخططات ألوان الطرفية.

مرحباً بـ UI: نظام تصميم مفتوح المصدر طورته Welcome to the Jungle (@wttj). مبني على React وTypeScript وTailwind CSS وAriakit، يجمع المكونات الأساسية اللازمة لبناء تطبيق ويب مميز، مع توثيق مفصل في ملف README.

Better Design هو خادم MCP مفتوح المصدر وسجل shadcn/ui يزود وكلاء البرمجة بالذكاء الاصطناعي بأنظمة التصميم، ورموز CSS الدلالية، ومبادئ واجهة المستخدم، وقواعد مراجعة WCAG، ويدعم عملاء مثل Claude Code وCursor وVS Code.

Radix Primitives هي مكتبة مكونات واجهة مستخدم مفتوحة المصدر ومنخفضة المستوى لبناء أنظمة تصميم وتطبيقات ويب سهلة الوصول، تركز على إمكانية الوصول والتخصيص وتجربة المطور. مرخصة بموجب MIT وتديرها WorkOS.

OpenDesign هو تطبيق سطح مكتب مفتوح المصدر يعمل محليًا كبديل لـ Claude Design. يدعم 25+ أداة CLI للبرمجة بما في ذلك DeepSeek Harness، وينشئ نماذج أولية وعروض تقديمية وصورًا ومقاطع فيديو مع أنظمة DESIGN.md المعتمدة على العلامة التجارية، ويصدّر بصيغ HTML/PDF/PPTX/MP4 تحت رخصة Apache 2.0.

daisyUI هي مكتبة مكونات مجانية ومفتوحة المصدر لـ Tailwind CSS، توفر مكونات واجهة مستخدم مصممة مسبقاً وقابلة للتخصيص يمكن استخدامها مباشرة في HTML، وتتميز بشعبية واسعة وتوثيق شامل ودعم مجتمعي.

FAST هو نظام واجهات تكيفي من مايكروسوفت للويب الحديث، يوفر إطارًا خفيفًا لبناء مكونات ويب متوافقة مع المعايير، بالإضافة إلى مكتبة مكونات بتصميم Fluent.

Primer CSS هو تنفيذ CSS لنظام تصميم Primer الخاص بـ GitHub، ويتم توزيعه كحزمة @primer/css على npm. يوفر ملفات Sass/SCSS مع فئات مساعدة وأنماط مكونات، وهو حالياً في وضع الصيانة (KTLO).