Awesome GitHub RepositoriesDesign Token Synchronization

Open Design is an AI design orchestration platform and LLM agent workspace designed for generating prototypes, presentations, and motion graphics. It functions as a local-first environment that integrates various command-line AI agents and coding tools into a unified design workflow, allowing users to migrate design specifications into brand-compliant source code. The project is distinguished by its ability to enforce visual consistency through a design system manager that defines brand contracts and tokens using Markdown. It features a specialized motion graphics generator that converts HTML

This project is a browser-based collaborative design platform that provides a comprehensive workspace for interface design, interactive prototyping, and design system management. It functions as a vector graphics editor that enables teams to create, manage, and iterate on designs in real-time, utilizing a component-based inheritance model to ensure consistency across complex projects. The platform distinguishes itself through a deep integration of design and development workflows. It features a specialized developer handoff workspace that allows for the inspection of design properties, precis

AgentMemory is a persistent knowledge store and memory server designed to provide AI coding agents with long-term memory. It functions as a knowledge graph engine and vector database store that saves and recalls project context, architectural decisions, and patterns across different sessions. The system distinguishes itself by using a tiered-memory consolidation pipeline that compresses raw observations into episodic, semantic, and procedural layers to optimize token usage. It employs a hybrid retrieval strategy combining keyword matching, vector embeddings, and graph traversal to surface rel

Mitosis is a cross-framework compiler that transforms a single JSX-based source into native components for multiple frontend libraries simultaneously. It functions as a multi-target UI library builder, allowing developers to maintain a single source of truth for design systems while generating production-ready code for diverse environments including React, Vue, Angular, and Svelte. The system operates by parsing unified component code into an intermediate JSON representation, which serves as the foundation for all downstream framework generators. This architecture utilizes a visitor-based tra

Webstudio is a visual CMS and website builder that provides a visual development environment for designing and publishing websites. It functions as an AI-powered design tool, a REST and GraphQL API client, and an atomic CSS compiler. The platform distinguishes itself through generative AI capabilities for creating layout variants and refining visual styles from text prompts. It integrates a headless CMS workflow that maps external data sources to visual components and utilizes a specialized compiler to convert design tokens into deduplicated atomic CSS for optimized page load speeds. The sys

David AI is a UI development toolkit that combines AI-powered page generation with a library of pre-built, copy-paste-ready components built on Tailwind CSS. At its core, it offers an AI builder that can generate complete landing pages and dashboards from natural language prompts, outputting clean, responsive Tailwind CSS code. The project provides a comprehensive collection of UI components—including buttons, forms, navigation elements, and data displays—that can be assembled into full page sections like hero blocks, pricing tables, and dashboards. The toolkit distinguishes itself through a

Theme-ui هو إطار عمل سمات React وأداة CSS-in-JS تُستخدم لبناء واجهات مستخدم قابلة للسمات. يعمل كأداة نظام تصميم تنشئ مقاييس مركزية قائمة على القيود للألوان، والطباعة، والتباعد لضمان الاتساق البصري عبر التطبيقات. يتميز إطار العمل باختصار استجابة قائم على المصفوفة للتخطيطات التي تبدأ بالهواتف المحمولة ومدير وضع ألوان مخصص يتزامن مع تفضيلات المتصفح ويحفظ اختيارات المستخدم. كما يتميز بنظام لإنشاء متغيرات أنماط مسماة للتحكم في مظهر المكونات عبر الخصائص ويوفر قدرات مزامنة لترجمة تكوينات السمات إلى Figma Styles. يغطي المشروع مجموعة واسعة من قدرات التصميم، بما في ذلك حقن CSS العالمي لإعادة تعيين العناصر، وتجاوزات السمات المتداخلة عبر السياق، ونظام تكوين دمج عميق لتوسيع إعدادات التصميم المسبقة. يتضمن أيضاً مجموعة من مكونات التخطيط القابلة للسمات، مثل الشبكات المتجاوبة ومدخلات النماذج الموحدة. تتوفر إضافة مخصصة لدمج نظام التصميم داخل مواقع Gatsby.

Iconoir هي مكتبة أيقونات SVG مفتوحة المصدر تتكون من أكثر من 1600 رسم متجه. تعمل كمجموعة أيقونات عابرة للمنصات مصممة للاستخدام عبر تطبيقات الويب والجوال، بالإضافة إلى حزمة أيقونات أدوات التصميم لـ Figma وFramer. يسهل المشروع سير عمل التصميم إلى الكود من خلال توفير مجموعة موحدة من الأصول التي تحافظ على التناغم البصري بين النماذج الأولية والبيئات الحية. ويدعم مجموعة واسعة من الأهداف، بما في ذلك React وVue وFlutter وتطوير الجوال الأصلي.

Horizon UI Chakra هو قالب لوحة تحكم ومكتبة مكونات شاملة مصممة لبناء تطبيقات الويب الإدارية. يوفر هيكلاً أساسياً يستخدم معمارية معيارية قائمة على المكونات لتسهيل البناء السريع لواجهات الإدارة المعقدة ولوحات تصور البيانات. يتميز المشروع بدمج نظام تصميم مركزي ينشر الرموز المرئية (visual tokens) في جميع أنحاء التطبيق، مما يضمن اتساق العلامة التجارية والأنماط عبر جميع عناصر الواجهة. كما يدعم التخطيطات المتجاوبة من خلال أنظمة الشبكات المرنة ويوفر تخصيصاً واسعاً للسمات، بما في ذلك دعم الوضعين الفاتح والداكن، لتتوافق مع متطلبات سهولة الوصول والمتطلبات المرئية المحددة. تتضمن المكتبة مجموعة من قوالب الصفحات الجاهزة وعناصر واجهة المستخدم القابلة لإعادة الاستخدام التي تبسط تطوير ميزات التطبيق القياسية مثل المصادقة والتحليلات. كما توفر أدوات سطر أوامر (CLI) لهيكلة المشاريع، مما يسمح للمطورين بإنشاء هياكل تطبيقات متكاملة (full-stack) ومزامنة أصول التصميم مع الكود المطبق للحفاظ على الاتساق طوال دورة حياة التطوير.

Liftkit is a modular code distribution tool and component code importer designed to download UI component source code directly into local repositories. It functions as a frontend component bridge, transferring pre-made UI elements and design patterns from remote repositories into local project directories for full implementation control. The utility acts as a design system synchronizer, aligning visual components and patterns across different design and coding tools. This process ensures consistency between layout and final code by synchronizing UI design patterns throughout the development w

هذا المشروع هو مدير لرموز التصميم (design tokens) مصمم لسد الفجوة بين أدوات التصميم الإبداعية وبيئات التطوير. يعمل كأداة أتمتة تستخرج أنماط التصميم، والمتغيرات، والمكونات من برمجيات التصميم وتحولها إلى هياكل بيانات قياسية قابلة للقراءة آلياً. تتميز الأداة بتوفير إطار عمل لتحويل بيانات التصميم لتلبية متطلبات منصة محددة، مثل تكوينات الوضع المظلم أو أنظمة المتغيرات الأصلية للهواتف المحمولة. تدعم برمجيات وسيطة للتحويل المخصص، مما يسمح للمستخدمين بتطبيق منطق محدد على مخرجات الرموز أثناء عملية التصدير لضمان التوافق مع أنظمة التنسيق المتنوعة. بالإضافة إلى الاستخراج والتحويل الأساسي، يسهل المشروع المزامنة عبر المنصات من خلال توزيع أصول التصميم على نقاط نهاية بعيدة وخطوط أنابيب التكامل المستمر. يحافظ على التوافق مع تنسيقات رموز التصميم القياسية في الصناعة، مما يضمن بقاء الخصائص المرئية متسقة عبر مشاريع برمجية متعددة وسير عمل التطوير.