Awesome GitHub RepositoriesUser Interface Frameworks

This project is a component-based UI framework and a React Material Design library. It provides a comprehensive set of reusable interface elements that implement Google Material Design specifications to ensure consistent visual styles and behaviors across web applications. The framework enables the construction of professional layouts for enterprise web interfaces and the rapid prototyping of frontend designs. It uses a collection of pre-designed React components to standardize layouts and accelerate the overall development process. The system integrates a styling engine and theme-based inje

Preact is a declarative UI library and a lightweight alternative to React for building user interfaces. It utilizes a component-based architecture and a virtual DOM to sync application state to the browser interface efficiently. The framework implements a modern React API and provides a compatibility layer to ensure existing component libraries and patterns can run within its environment. It also functions as a server-side rendering engine, generating HTML on the server and hydrating it on the client to optimize page load speeds. Additional capabilities include virtual DOM state management t

HeroUI is a declarative toolkit for building accessible user interfaces through modular, React-based component composition. It provides a comprehensive set of reusable building blocks designed to standardize visual language and interaction patterns across web and mobile applications. The library distinguishes itself through an integrated approach to accessibility and styling. It automatically manages state and keyboard interactions by injecting appropriate attributes, while utilizing a utility-driven styling architecture to enforce design system consistency. Developers can leverage polymorphi

This project is a JavaScript full-stack tutorial providing a step-by-step guide to building a complete web application from scratch. It focuses on the manual implementation of a custom JavaScript toolchain, encompassing the development of a server-side rendering workflow and a client-side state manager. The project distinguishes itself by implementing core development utilities without high-level frameworks, including custom solutions for bundling, transpilation, linting, and hot module replacement. It also features a real-time communication system based on WebSockets for bidirectional messag

UIkit is a CSS front-end framework and accessible UI component library designed for building responsive web interfaces. It provides a comprehensive set of styling classes and modular components alongside a JavaScript interaction toolkit for managing behavioral elements. The framework includes native support for internationalized web interfaces, featuring multi-locale text translation and right-to-left layout directions. It employs a responsive layout engine that uses flexible grids, adaptive breakpoints, and container widths to align content across different screen sizes. The toolkit covers

Wasp is a declarative full-stack web framework that enables developers to build and deploy applications by defining their architecture in a centralized configuration. By using a high-level specification, the framework automates the orchestration of frontend, backend, and database components, ensuring that infrastructure concerns like routing, authentication, and data modeling are handled consistently across the entire stack. The framework distinguishes itself through its compiler-driven approach, which translates declarative configurations into cohesive, production-ready codebases. It provide

Inferno is a virtual DOM UI library and high-performance DOM renderer used for building component-based user interfaces. It functions as a server-side rendering engine and a client-side framework that synchronizes application state with the visual interface through a declarative structure. The project distinguishes itself as a React-compatible UI framework, providing a compatibility layer that allows components designed for other reactive environments to run without modification. Its capability surface covers virtual DOM management, including node diffing and reconciliation, and a full serve

Flet is a cross-platform framework that enables developers to build interactive desktop, mobile, and web applications using only Python. By utilizing a declarative programming model, it allows for the construction of complex user interfaces through a hierarchical structure of components, removing the need for specialized knowledge of web-specific languages like HTML, CSS, or JavaScript. The framework distinguishes itself by offloading visual rendering to a high-performance graphics engine while maintaining application logic within a centralized server-side environment. This architecture synch

Mithril.js is a JavaScript framework for building single page applications. It functions as a virtual DOM library and reactive UI framework, providing a system to synchronize application state with visual elements to ensure interfaces update instantly. The toolkit includes a built-in client side router that maps browser URL paths to specific components without reloading the page. It also features an integrated HTTP request client for performing asynchronous network calls to remote APIs for data retrieval and transmission. The framework covers broad capabilities for frontend development, incl

Marko is a component-based web framework and HTML-based template engine used to build reactive user interfaces. It functions as a server-side rendering framework that compiles declarative templates into optimized JavaScript for efficient browser execution. The framework utilizes virtual DOM-less rendering to map template expressions directly to DOM nodes. It employs ahead-of-time template compilation and server-side HTML streaming to send rendered fragments to the client in chunks. The system manages user interfaces through a component-based view hierarchy with reactive data binding and fine

React is a JavaScript library for building user interfaces through the composition of modular, self-contained components. It employs a declarative programming model where developers describe the desired visual state, and the library automatically manages the underlying document updates and state synchronization. By utilizing a virtual representation of the document, it calculates and applies minimal changes to the browser, ensuring efficient rendering even in complex applications. The library distinguishes itself through a sophisticated scheduling system that manages rendering work in increme

Sokol is a C hardware abstraction layer and cross-platform graphics library designed for managing windowing, input, and audio across different operating systems. It functions as a GPU resource manager and multimedia application framework, providing a unified API for rendering 2D and 3D graphics across WebGL, Metal, Direct3D, and OpenGL. The project is distinguished by its single-header implementation, which simplifies integration and portability. It utilizes a stateless render pass definition and a one-update-per-frame model to synchronize CPU data to GPU memory and manage resource lifecycles

Model Context Protocol is a standardized framework for connecting large language models to external data sources and executable tools. It enables the creation of a universal interface where servers expose tools, resources, and prompts that can be discovered and utilized by various AI clients. The protocol utilizes a JSON-RPC message system that is transport-agnostic, supporting both standard input/output for local processes and HTTP with server-sent events for remote connections. It emphasizes security and control by delegating model sampling to the client to keep API keys secure from servers

Cura is 3D printer slicing software and a G-code generator that converts 3D models into machine-readable instructions. It provides a management interface for configuring printer profiles and coordinating additive manufacturing workflows. The software includes a multi-extruder print controller for defining multi-material or multi-nozzle hardware setups. It supports custom printer integration by allowing users to define machine dimensions and G-code requirements for hardware not included in default lists. The platform covers remote print management through integration with external print serve

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

Arco Design هي مكتبة مكونات واجهة مستخدم React وإطار عمل نظام تصميم يُستخدم لبناء واجهات ويب احترافية. توفر مجموعة من العناصر البصرية والتخطيطات المبنية مسبقاً والمصممة للحفاظ على لغة تصميم متسقة عبر التطبيقات. يتميز النظام بمحرك سمات يعتمد على الرموز يستخدم متغيرات تصميم هرمية ومتغيرات CSS لتمكين تخصيص بصري دقيق. يسمح هذا بتعديل الأنماط على مستوى العالم والمكونات من خلال محرر سمات أو محمل مخصص لمحاذاة الواجهة مع هويات تجارية محددة. يدعم إطار العمل تطوير واجهة المستخدم للمؤسسات من خلال توفير أدوات لإدارة نظام التصميم ومستودع مركزي لتخزين وتوزيع مكونات الأعمال القابلة لإعادة الاستخدام. تسهل هذه الإمكانيات تجميع التخطيطات الوظيفية ومشاركة وحدات الواجهة المخصصة عبر مشاريع متعددة.

Wux هو إطار عمل ومكتبة واجهة مستخدم قائمة على المكونات مصممة خصيصاً لبناء واجهات المستخدم داخل منصة WeChat Mini Program. توفر مجموعة من المكونات القابلة لإعادة الاستخدام والتوسيع التي تعمل كمجموعة واجهة مستخدم عبر الأجهزة لضمان مظهر وشعور متسق عبر أحجام الشاشات والأجهزة المختلفة. ينفذ إطار العمل بنية مكونات واجهة أمامية معيارية، مما يسمح للمطورين بإنشاء تخطيطات متجاوبة باستخدام عناصر مرئية مصممة مسبقاً. يستخدم نظاماً من المكونات القابلة للتخصيص للحفاظ على الاتساق المرئي عبر نظام WeChat البيئي. يغطي المشروع مجموعة من القدرات المعمارية، بما في ذلك التكوين المدفوع بالخصائص، وسمات CSS المتغيرة للتخصيص الديناميكي، وحقن الأنماط المعيارية. كما يستخدم مغلفات عناصر مخصصة لتغليف المنطق والأنماط لتحسين قابلية إعادة الاستخدام.

This project is a Blazor component library and web UI framework used for building web applications with ASP.NET Core Blazor. It serves as an implementation of the Fluent Design System, providing a collection of reusable, pre-styled user interface elements to ensure visual consistency and accessibility. The library includes an asynchronous data grid capable of resolving remote queries through asynchronous data fetching and entity mapping. It utilizes a design token system to manage visual styles and personalization settings across an application. The framework covers broader capabilities for

هذا المشروع عبارة عن قالب صفحة هبوط Next.js ومجموعة أدوات واجهة مستخدم React مصممة لعرض منتجات البرمجيات والمشاريع مفتوحة المصدر. يعمل كأساس لموقع تسويق مهني وقالب موقع Tailwind CSS لبناء واجهات ويب حديثة. يوفر إطار العمل تخطيطات ومكونات متخصصة لعروض المشاريع مفتوحة المصدر، وصفحات هبوط SaaS، ولوحات تحكم المسؤول. يتضمن مجموعة من المكونات المتجاوبة وأدوات التنسيق التي تسمح بتخصيص التصميم المرئي للألوان والخطوط والتخطيطات. يغطي سطح القدرة مجموعة متنوعة من عناصر واجهة المستخدم، بما في ذلك الرسوم المتحركة القائمة على التمرير، ومخططات تصور البيانات، والمكونات التفاعلية، ودوائر المحتوى. تدعم البنية العرض من جانب الخادم، والتوجيه القائم على الملفات، وخط أنابيب محتوى قائم على markdown لفصل المحتوى عن منطق التطبيق.

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