awesome-repositories.com
المدونة
awesome-repositories.com

اكتشف أفضل مستودعات المصادر المفتوحة باستخدام بحث مدعوم بالذكاء الاصطناعي.

استكشفعمليات بحث منسقةبدائل مفتوحة المصدربرمجيات ذاتية الاستضافةالمدونةخريطة الموقع
المشروعحولكيفية ترتيب النتائجالصحافةخادم MCP
قانونيالخصوصيةالشروط
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·

مكونات شارات واجهة المستخدم

تم تحديث الترتيب في 30 يونيو 2026

For a library of ui badge components, the strongest matches are angular/components (Angular Material includes a reusable MatBadge component that provides), mui/material-ui (Material UI is a comprehensive React component library that) and microsoft/fluentui (Fluent UI is a comprehensive design system and React). markmead/hyperui and gluestack/gluestack-ui round out the shortlist. Each is ranked by relevance to your query, popularity and recent activity.

استعرض أفضل مكونات شارات واجهة المستخدم (UI badge) مفتوحة المصدر لمشروعك. قارن بين المكتبات الأعلى تقييماً من حيث النجوم والنشاط للعثور على الخيار الأنسب.

مكونات شارات واجهة المستخدم

اعثر على أفضل المستودعات باستخدام الذكاء الاصطناعي.سنبحث عن أفضل المستودعات المطابقة باستخدام الذكاء الاصطناعي.
  • angular/componentsالصورة الرمزية لـ angular

    angular/components

    25,033عرض على GitHub↗

    This project is a collection of reusable UI component libraries for the Angular framework. It serves as an accessibility framework and a suite of building blocks for constructing user interfaces. The library provides a specialized component suite for implementing Material Design visual and interaction specifications. It also includes dedicated integrations for embedding interactive Google Maps with geographic data overlays and integrating YouTube video players with support for deferred loading. The project covers a broad range of UI development capabilities, including the creation of accessi

    Angular Material includes a reusable MatBadge component that provides color variants, sizing, dot indicator, positioning, and accessibility support, making it a solid option for building notification badges and tags in Angular web applications.

    TypeScriptAccessible UI Components
    عرض على GitHub↗25,033
  • mui/material-uiالصورة الرمزية لـ mui

    mui/material-ui

    98,459عرض على GitHub↗

    Material UI is a comprehensive component-based library designed to accelerate the construction of professional, accessible web interfaces. It provides a centralized design system framework that manages visual tokens, typography, and color palettes to ensure consistent branding and layout constraints across complex application architectures. By encapsulating behavioral and accessibility logic within modular primitives, the library enables developers to build inclusive user experiences that adhere to rigorous design standards. The project distinguishes itself through a zero-runtime styling engi

    Material UI is a comprehensive React component library that includes a fully featured Badge component with multiple color variants, size options, icon support, dot indicators, customizable positioning, and accessibility support, perfectly matching your need for reusable badge UI components.

    JavaScriptComponent-Based UI LibrariesAccessible Component SuitesComponent Theming
    عرض على GitHub↗98,459
  • microsoft/fluentuiالصورة الرمزية لـ microsoft

    microsoft/fluentui

    20,063عرض على GitHub↗

    Fluent UI is a design system framework and TypeScript UI toolkit providing a comprehensive set of styles and accessibility guidelines. It functions as a React UI component library and a web component library, offering a collection of pre-styled elements and layout utilities to create a cohesive visual experience across web platforms. The project translates a brand design language into a functional library of reusable components, ensuring cross-product visual consistency. It enables the implementation of design systems for enterprise web applications through the use of standardized visual and

    Fluent UI is a comprehensive design system and React component library that includes a full set of badge components with multiple color variants, size options, icon support, dot indicators, positioning behavior, and built-in accessibility, fitting the visitor's needs exactly.

    TypeScriptInterface Component LibrariesAccessibility StandardsDesign Consistency
    عرض على GitHub↗20,063
  • markmead/hyperuiالصورة الرمزية لـ markmead

    markmead/hyperui

    12,137عرض على GitHub↗

    HyperUI is a dependency-free collection of responsive HTML layouts and pre-styled components designed for various web domains. It functions as a Tailwind CSS component library where users integrate standalone HTML snippets via a copy-paste distribution model to avoid package installation and framework overhead. The library features one-click markup copying from a pre-built component gallery. It includes specialized design systems, such as high-contrast neobrutalist styling with heavy borders, and visual tools for generating dark mode color palettes and harmonic typography scales. The compone

    HyperUI is a broad Tailwind CSS component library that includes badge indicators and status indicators as part of its pre-built HTML snippets, providing reusable badge UI components with color and size variants via Tailwind utility classes, and includes accessibility support, making it a valid source for badge components even though it is not a dedicated badge-only library.

    HTMLBadge IndicatorsStatus Indicators
    عرض على GitHub↗12,137
  • gluestack/gluestack-uiالصورة الرمزية لـ gluestack

    gluestack/gluestack-ui

    4,931عرض على GitHub↗

    gluestack-ui is a cross-platform React component library built with Tailwind CSS. It provides over 30 pre-built, accessible components that can be installed by copying their source files directly into a project, giving developers full control over customization without external runtime dependencies. Every component implements WAI-ARIA patterns, keyboard navigation, and screen reader support out of the box. A key differentiator is the copy-paste architecture: rather than a traditional package dependency, component source code is placed in the project, allowing direct editing and eliminating ve

    gluestack-ui is a cross‑platform React component library that includes status badges among its accessible, copy‑paste components, offering the color variants, size options, and accessibility support you need for web badge components.

    TypeScriptAccessible UI Components
    عرض على GitHub↗4,931
  • mantinedev/mantineالصورة الرمزية لـ mantinedev

    mantinedev/mantine

    31,263عرض على GitHub↗

    Mantine is a comprehensive component library for building accessible and responsive web applications. It provides a foundational set of UI elements and layout primitives, anchored by a base component that supports consistent styling, spacing, and layout properties across the entire interface. The library is built on a design-driven theme engine that uses a provider-based system to propagate global design tokens and color schemes throughout an application. The library distinguishes itself through a robust architecture that emphasizes component composition and reusable interaction logic. It uti

    Mantine is a comprehensive React component library that includes a wide range of UI elements, likely including badge components with color variants, sizes, and accessibility—fitting your need for reusable badge UI components, though it's a broader toolkit rather than a badge-specific package.

    TypeScriptFloating Element Positioning
    عرض على GitHub↗31,263
  • taiga-family/taiga-uiالصورة الرمزية لـ taiga-family

    taiga-family/taiga-ui

    4,002عرض على GitHub↗

    Taiga UI is an Angular UI component library and accessible design system used for building enterprise web interfaces. It provides a comprehensive collection of reusable interface elements and layout tools, functioning as a mobile-first UI kit with responsive components that adapt to different device capabilities. The library distinguishes itself through an integrated data visualization library featuring various chart types and a dedicated form management framework with built-in validation and formatting for specialized data. It also features AI-driven development workflows by integrating comp

    Taiga UI is a comprehensive Angular component library and design system that includes badge UI components with accessibility and theming support, providing the reusable badge elements you need for web interfaces.

    TypeScriptAccessible Design SystemsEnterprise Component SystemsForm and Input Management
    عرض على GitHub↗4,002
  • ant-design/ant-designالصورة الرمزية لـ ant-design

    ant-design/ant-design

    98,362عرض على GitHub↗

    Ant Design is an enterprise-grade component library and design system framework built for developing complex, data-heavy web applications. It provides a comprehensive collection of pre-built, state-driven interface elements that map data properties to rendered components, ensuring consistent interaction patterns and visual language across large-scale projects. The library distinguishes itself through a robust styling architecture that utilizes design tokens and hierarchical configuration providers to propagate global settings like themes, locale, and layout direction. By employing component-l

    Ant Design is a comprehensive React UI library that includes Badge and Tag components with color variants, dot indicators, positioning, and accessibility support, though it is a full design system rather than a dedicated badge-only library and lacks explicit badge size options and icon integration.

    TypeScriptComponent LibrariesButtonsDesign Tokens
    عرض على GitHub↗98,362
  • heroui-inc/herouiالصورة الرمزية لـ heroui-inc

    heroui-inc/heroui

    29,684عرض على GitHub↗

    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

    HeroUI is a general-purpose React UI component library that likely includes badge components as part of its accessible building blocks, fitting the request for reusable badge UI components, though badge-specific features are not explicitly detailed.

    MDXComponent LibrariesAccessible Component LibrariesDeclarative UI Toolkits
    عرض على GitHub↗29,684
  • ekmas/neobrutalism-componentsالصورة الرمزية لـ ekmas

    ekmas/neobrutalism-components

    4,956عرض على GitHub↗

    This project is a neobrutalist UI component library and accessible design system for React. It provides a collection of high-contrast web elements characterized by bold colors, thick borders, and a raw aesthetic. The library distinguishes itself by combining a data visualization toolkit—featuring styled charts and responsive tables—with a comprehensive set of interactive components. It balances this specific visual style with accessibility standards for keyboard navigation and screen readers. The component surface covers a wide range of functional areas, including complex form controls with

    This library is a neobrutalist React UI component library that includes badge components as part of its accessible design system, offering reusable badge elements with color variants, icon support, and accessibility features tailored to web interfaces.

    TypeScriptAesthetic Theme ImplementationsComponent LibrariesAccessible Interface Design
    عرض على GitHub↗4,956
  • chakra-ui/chakra-uiالصورة الرمزية لـ chakra-ui

    chakra-ui/chakra-ui

    40,438عرض على GitHub↗

    Chakra UI is a design system component library and styling framework that provides a foundation for building consistent, accessible web interfaces. It functions as a centralized theme configuration engine, using a design-token-driven architecture to manage visual properties like color palettes and spacing rules as a single source of truth across an entire application. The framework distinguishes itself through a type-safe styling utility that automatically generates TypeScript definitions from theme configurations, ensuring accurate property referencing and editor autocompletion. It employs a

    Chakra UI is a React component library that includes a badge component with color variants, size options, icon support, and strong accessibility, making it a solid fit for reusable badge UI components, though it does not offer a dedicated dot indicator or explicit positioning behaviors as standalone badge features.

    TypeScriptDesign System ImplementationsComponent Library ArchitecturesDesign Token Architectures
    عرض على GitHub↗40,438
قارن بين أفضل 10 في لمحة
المستودعالنجوماللغةالترخيصآخر تحديث
angular/components25KTypeScriptMIT22 يونيو 2026
mui/material-ui98.5KJavaScriptMIT22 يونيو 2026
microsoft/fluentui20.1KTypeScriptNOASSERTION23 يونيو 2026
markmead/hyperui12.1KHTMLMIT20 يونيو 2026
gluestack/gluestack-ui4.9KTypeScript—20 فبراير 2026
mantinedev/mantine31.3KTypeScriptMIT16 يونيو 2026
taiga-family/taiga-ui4KTypeScriptApache-2.023 يونيو 2026
ant-design/ant-design98.4KTypeScriptMIT16 يونيو 2026
heroui-inc/heroui29.7KMDXApache-2.023 يونيو 2026
ekmas/neobrutalism-components5KTypeScriptmit21 يوليو 2025

Related searches

  • a tool for generating project badges
  • نظام تصميم لبناء مكونات واجهة المستخدم
  • مكتبة مكونات واجهة مستخدم لمشاريع SvelteKit
  • مجموعة من مكونات Tailwind CSS الجاهزة
  • مكتبة لتخصيص مكونات واجهة المستخدم
  • مجموعة مكونات واجهة مستخدم قابلة لإعادة الاستخدام
  • a library of UI components for React
  • مكتبة مكونات لتطبيقات Vue 3