awesome-repositories.com
Blog
MCP
awesome-repositories.com

Discover the best open-source repositories with AI-powered search.

ExploreCurated searchesOpen-source alternativesSelf-hosted softwareBlogSitemap
ProjectMCP serverAboutHow we rankPress
LegalPrivacyTerms
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
Back to system-ui/theme-ui

Open-source alternatives to Theme Ui

30 open-source projects similar to system-ui/theme-ui, ranked by how many features they have in common. Compare stars, activity and what each one does to find the best Theme Ui alternative.

  • styled-components/xstyledstyled-components avatar

    styled-components/xstyled

    2,307View on GitHub↗

    xstyled is a utility-first CSS-in-JS framework designed for the React ecosystem. It functions as a styling library that enables developers to manage component styles and responsive layouts by mapping design system tokens directly to component properties. The framework distinguishes itself by providing a centralized theme management system that propagates design tokens, such as colors and spacing, throughout the component tree. It includes a responsive layout generator that automatically calculates media query breakpoints based on viewport width, allowing for the creation of fluid grid structu

    MDXcsscss-in-jsemotion
    View on GitHub↗2,307
  • rebassjs/rebassrebassjs avatar

    rebassjs/rebass

    7,905View on GitHub↗

    Rebass is a React design system library that provides a collection of theme-driven, responsive UI primitives. It functions as a theme-based layout engine, using a set of stateless components to standardize spacing, typography, and colors across a user interface. The library distinguishes itself by mapping style properties to a central design theme through a styled-system approach. This allows for responsive style mapping where components automatically adapt their appearance based on screen size and provides the ability to swap underlying HTML elements while preserving styling logic to maintai

    JavaScriptcolorcomponentscss
    View on GitHub↗7,905
  • elastic/euielastic avatar

    elastic/eui

    6,337View on GitHub↗

    EUI is a React UI component library and design system framework. It provides a collection of reusable, typed interface components and visual guidelines to ensure a unified user experience across web application layouts. The project functions as a themed UI toolkit, enabling the management of visual aesthetics and the ability to toggle between light and dark modes. It incorporates a CSS-in-JS styling library for defining custom styles and rulesets for individual application elements. The framework covers broad capability areas including design system implementation, custom interface styling,

    TypeScript
    View on GitHub↗6,337

AI search

Explore more awesome repositories

Describe what you need in plain English — the AI ranks thousands of curated open-source projects by relevance.

Find more with AI search
  • ben-rogerson/twin.macroben-rogerson avatar

    ben-rogerson/twin.macro

    8,030View on GitHub↗

    twin.macro is a build-time style compiler and utility-first styling tool that converts Tailwind CSS utility classes into optimized style objects for JavaScript styling libraries. It acts as an integration bridge, allowing developers to use Tailwind design tokens and utility classes within a component-based architecture. The project distinguishes itself by performing transformations during the compilation phase rather than at runtime. It maps utility strings to CSS-in-JS engines such as Emotion and Styled Components, resolving design tokens directly from a Tailwind configuration file to ensure

    TypeScriptbabelbabel-macrocss-in-js
    View on GitHub↗8,030
  • styled-system/styled-systemstyled-system avatar

    styled-system/styled-system

    7,870View on GitHub↗

    Styled System is a JavaScript library that provides a style props approach for building UI components, enabling developers to map CSS properties directly to component props for rapid, declarative development. At its core, it resolves design tokens from a centralized theme object into CSS values, ensuring consistent styling across components without writing custom stylesheets. The library supports theme-aware styling that connects component styles to a theme object for scalable, maintainable design systems with dynamic value resolution. The library differentiates itself through several capabil

    JavaScriptcolorscsscss-in-js
    View on GitHub↗7,870
  • carbon-design-system/carboncarbon-design-system avatar

    carbon-design-system/carbon

    9,172View on GitHub↗

    Carbon is an enterprise design system that provides a comprehensive collection of reusable UI components, design tokens, and guidelines for building professional web applications. It functions as a CSS framework that enforces a unified design language across projects through standardized typography, spacing, and color palettes. The system utilizes a platform-agnostic design token system to maintain visual consistency across different technologies. This includes centralized management of brand colors, motion easing curves, and a curated library of accessible SVG icons. The framework covers a

    TypeScript
    View on GitHub↗9,172
  • tamagui/tamaguitamagui avatar

    tamagui/tamagui

    13,729View on GitHub↗

    Tamagui is a cross-platform user interface framework designed to build high-performance, themeable applications that share logic and styling across web and mobile environments. It functions as a comprehensive design system orchestrator, providing a collection of type-safe components that compile to optimized atomic CSS for the web and native code for mobile platforms. By utilizing a build-time compiler, the framework eliminates runtime overhead, ensuring consistent visual output and interaction behavior regardless of the target platform. The framework distinguishes itself through its advanced

    TypeScriptatomic-csscss-in-jsoptimizing-compiler
    View on GitHub↗13,729
  • mui/material-uimui avatar

    mui/material-ui

    98,459View on 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

    JavaScriptdesign-systemmaterial-designmaterial-ui
    View on GitHub↗98,459
  • chakra-ui/chakra-ui-vuechakra-ui avatar

    chakra-ui/chakra-ui-vue

    1,846View on GitHub↗

    Chakra UI Vue is a component library for the Vue.js ecosystem that provides a collection of modular, accessible building blocks for constructing user interfaces. It functions as a design system provider, enabling developers to manage global design tokens and visual consistency across complex applications through a centralized theme provider. The framework distinguishes itself by integrating accessibility logic and WAI-ARIA attributes directly into its base components, ensuring that keyboard navigation and screen reader compatibility are handled by default. It utilizes a declarative styling ap

    JavaScripta11yaccessibilitychakra-ui
    View on GitHub↗1,846
  • unocss/unocssunocss avatar

    unocss/unocss

    18,854View on GitHub↗

    UnoCSS is an atomic CSS engine and utility-first framework that generates styles on-demand based on the specific classes used in your source code. By scanning your project files during the build process, it produces only the CSS necessary for your application, effectively minimizing bundle size and eliminating unused styles. The engine distinguishes itself through a highly modular, configuration-driven architecture that allows for deep customization of design tokens, rules, and presets. It supports advanced styling patterns such as attribute-based styling, tag-based styling, and dynamic varia

    TypeScriptatomic-cssengineunocss
    View on GitHub↗18,854
  • uswds/uswdsuswds avatar

    uswds/uswds

    7,116View on GitHub↗

    The United States Web Design System is a government design system and accessible UI framework. It provides a collection of standardized CSS and JavaScript components, along with a CSS component library, specifically designed for building consistent federal government websites. The system allows for custom CSS theme development through the use of design tokens for colors, spacing, and typography. Users can customize visual themes and compile custom styles to maintain a unified brand identity across multiple web properties. The framework covers responsive interface design and web accessibility

    SCSS
    View on GitHub↗7,116
  • north/northN

    north/north

    4,798View on GitHub↗

    North is a responsive web design methodology and Sass-based CSS architecture framework. It provides a system for building mobile-first user interfaces using fluid grids and progressive enhancement techniques to ensure a consistent experience across different browser capabilities and screen sizes. The project features a standardized CSS naming system that uses Sass mixins to programmatically generate class names, distinguishing between components, layouts, and states. It also functions as a frontend project scaffolding tool, providing a generator to bootstrap new environments with pre-configur

    CSS
    View on GitHub↗4,798
  • shopify/polaris-reactShopify avatar

    Shopify/polaris-react

    6,174View on GitHub↗

    Polaris React is a production-ready component library that implements Shopify's Polaris design system for building consistent merchant-facing admin interfaces. It provides a comprehensive set of reusable React components, including accessible form inputs, data display elements, layout and navigation structures, and visual feedback indicators, all styled through a semantic color token system applied via CSS custom properties for dynamic light and dark mode support. The library distinguishes itself with an icon-first visual language featuring over 400 commerce-specific SVG icons delivered as fi

    TypeScriptcomponent-librarydesign-systemdesign-systems
    View on GitHub↗6,174
  • styled-components/styled-componentsstyled-components avatar

    styled-components/styled-components

    41,094View on GitHub↗

    styled-components is a CSS-in-JS styling library and tool for React components. It provides a cross-platform UI styling API and a dynamic theme management system to maintain consistent design tokens and encapsulate visual logic, preventing global scope conflicts. The library utilizes a unified interface that works across both web environments and native mobile frameworks. It enables the definition of styles using JavaScript and TypeScript template literals, allowing CSS to be bound directly to components. The system supports dynamic prop-based styling, style inheritance, and the creation of

    TypeScriptcsscss-in-jsreact
    View on GitHub↗41,094
  • wix/react-native-ui-libwix avatar

    wix/react-native-ui-lib

    7,139View on GitHub↗

    This project is a React Native UI library and mobile component framework designed for building consistent, themed mobile applications. It provides a collection of reusable user interface components and layout tools, functioning as a cross-platform design system to maintain visual uniformity across different mobile platforms. The toolkit distinguishes itself through a themed UI approach, utilizing global design foundations for typography, color palettes, and spacing. It allows for dynamic theme configuration and the use of style presets to ensure standardized branding across an entire project.

    TypeScriptandroidcomponentshacktoberfest
    View on GitHub↗7,139
  • jxnblk/styled-systemjxnblk avatar

    jxnblk/styled-system

    7,870View on GitHub↗

    styled-system is a prop-based styling library and CSS-in-JS theme system. It functions as a design token orchestrator that maps component properties to a central theme, allowing developers to change element appearances by passing style properties directly to components instead of writing separate stylesheets. The library features a responsive style prop engine that enables the creation of fluid layouts. This is achieved by using shorthand arrays to adjust styles across different screen breakpoints, ensuring visual arrangements adapt to various screen sizes. The system covers a wide range of

    JavaScript
    View on GitHub↗7,870
  • akveo/nebularakveo avatar

    akveo/nebular

    8,127View on GitHub↗

    Nebular is an Angular UI component library that implements the Eva Design System, providing a comprehensive set of over thirty-five ready-made UI elements with full theming support. The library is built around a design-token-driven architecture where visual properties are compiled into CSS custom properties, enabling global style overrides and consistent branding across applications without modifying component internals. The framework includes a built-in dark mode system activated by toggling a CSS class on the root element, which triggers pre-defined token overrides across all components. Au

    TypeScriptakveoangularangular-cli
    View on GitHub↗8,127
  • creativetimofficial/material-tailwindcreativetimofficial avatar

    creativetimofficial/material-tailwind

    4,359View on GitHub↗

    Material Tailwind is a responsive web UI framework and component library built with Tailwind CSS. It provides a customizable design system that implements Material Design principles for web applications. The project focuses on a customizable design system, allowing for centralized theme configuration and utility-based styling to maintain visual consistency across interfaces. The library includes a wide range of reusable interface elements, covering layout structures, navigation systems, and overlay components. It provides specialized tools for web form construction, data input controls, and

    TypeScriptjavascriptmaterialmaterial-design
    View on GitHub↗4,359
  • styled-components/vue-styled-componentsstyled-components avatar

    styled-components/vue-styled-components

    1,379View on GitHub↗

    This project is a styling library for Vue that enables component-based design by attaching CSS rules directly to HTML tags or component constructors. It utilizes tagged template literals to encapsulate design logic within JavaScript, allowing developers to define, extend, and manage styles directly alongside component code. The library distinguishes itself through a dynamic style injection engine that evaluates functions against component properties at runtime, ensuring visual output updates in response to data changes. It supports polymorphic rendering, which allows the underlying HTML eleme

    JavaScriptcsscss-in-jsvue
    View on GitHub↗1,379
  • epicmaxco/vuestic-uiepicmaxco avatar

    epicmaxco/vuestic-ui

    3,745View on GitHub↗

    Vuestic UI is a Vue 3 component library providing a collection of pre-made user interface elements. It serves as a responsive UI framework and a themed component system designed to speed up frontend development and maintenance. The toolkit features a centralized configuration system for global styling and dynamic branding, including a built-in dark mode. It includes an internationalized interface toolkit with native support for localization and translating application content for multiple languages. The library provides a set of accessible web components that meet accessibility standards for

    Vueaccessibilitycomponentsjavascript
    View on GitHub↗3,745
  • codyhouse/codyhouse-frameworkcodyhouse avatar

    codyhouse/codyhouse-framework

    1,147View on GitHub↗

    Codyhouse Framework is a front-end design system framework and CSS utility framework that provides an accessible UI component library for building bespoke user interfaces. It combines modular component authoring, semantic accessible markup, and utility-first styling classes with design-token-driven styling to enforce consistent visual design rules across web projects. The platform includes global design token configuration for color palette generation, typography scales, spacing rules, and interactive element themes. It supports build-time asset optimization by removing unused style rules dur

    CSScssdesign-systemframework
    View on GitHub↗1,147
  • hauptrolle/chakra-templateshauptrolle avatar

    hauptrolle/chakra-templates

    1,541View on GitHub↗

    Chakra Templates is a collection of prebuilt, responsive interface patterns designed for integration into React applications. It functions as a frontend design system resource, providing modular UI building blocks that allow developers to maintain consistent styling and layout standards across multiple application screens. The repository provides raw source code for every template, enabling direct integration and full customization within local project files. By utilizing a style-prop-driven approach, these components map design tokens to attributes, ensuring that layouts remain consistent wi

    TypeScriptchakra-templateschakra-uihacktoberfest
    View on GitHub↗1,541
  • tailwindlabs/tailwindcsstailwindlabs avatar

    tailwindlabs/tailwindcss

    95,592View on GitHub↗

    Utility-first CSS framework for fast, design-system-friendly styling.

    TypeScriptcssframeworkutility
    View on GitHub↗95,592
  • horizon-ui/horizon-ui-chakrahorizon-ui avatar

    horizon-ui/horizon-ui-chakra

    2,877View on GitHub↗

    Horizon UI Chakra is a comprehensive dashboard template and component library designed for building administrative web applications. It provides a foundational boilerplate that utilizes a modular, component-based architecture to facilitate the rapid construction of complex management interfaces and data visualization panels. The project distinguishes itself by integrating a centralized design system that propagates visual tokens throughout the application, ensuring consistent branding and styling across all interface elements. It supports responsive layouts through fluid grid systems and offe

    JavaScriptadminadmin-dashboardadmin-panel
    View on GitHub↗2,877
  • mui/pigment-cssmui avatar

    mui/pigment-css

    1,125View on GitHub↗

    Pigment CSS is a framework-agnostic styling tool that moves component style processing from the browser runtime to the build phase. By parsing component source code and theme configurations during compilation, it generates standalone, optimized CSS files and standard class names, effectively eliminating the need for runtime style calculation. The library provides a system for managing design tokens, such as colors and spacing, by transforming them into native CSS variables. This approach allows for dynamic styling and theme-aware logic without requiring a JavaScript-based engine. It also supp

    TypeScript
    View on GitHub↗1,125
  • coreui/coreui-free-react-admin-templatecoreui avatar

    coreui/coreui-free-react-admin-template

    4,940View on GitHub↗

    This project is a React-based administrative template and UI kit designed for building dashboards. It provides a comprehensive collection of pre-styled layouts, an accessible component library, and a Sass-based UI framework for creating administrative interfaces. The template is specifically structured as an AI-optimized project, utilizing coding patterns and organization designed to help AI assistants generate consistent, production-ready React code. It features a flexible styling system using Sass variables and CSS custom properties to support customizable light and dark themes. The kit co

    JavaScriptadminadmin-dashboardadmin-panel
    View on GitHub↗4,940
  • alfonsobries/vue-tailwindalfonsobries avatar

    alfonsobries/vue-tailwind

    2,164View on GitHub↗

    This project is a modular user interface framework for Vue applications that provides a collection of reusable components built with Tailwind CSS. It functions as a configuration-driven design system tool, enabling developers to maintain visual consistency across complex applications through centralized theme management and utility-based styling. The library distinguishes itself through a highly configurable architecture that supports variant-based style mapping and component instance customization. Developers can define global defaults or create multiple versions of the same interface elemen

    TypeScripttailwindcsstypescriptunlimited-variants
    View on GitHub↗2,164
  • vechai/vechaiuivechai avatar

    vechai/vechaiui

    1,217View on GitHub↗

    VechaiUI is an accessible React UI library built on top of utility-first styling principles and unstyled accessible foundations. It provides pre-designed user interface components that use low-level utility classes and compound component composition to share internal state and behavior while maintaining keyboard navigation and screen reader support. The library centers around a context-based theme provider that distributes global color palettes, typography, and design tokens down the component tree. It includes runtime dark mode switching to dynamically toggle between light and dark visual th

    TypeScriptcssdark-themeheadlessui
    View on GitHub↗1,217
  • mozilla-firefox/firefoxmozilla-firefox avatar

    mozilla-firefox/firefox

    11,305View on GitHub↗

    Firefox is a cross-platform web browser engine designed to render web content, execute JavaScript, and manage secure browsing sessions. It utilizes a multi-process isolation architecture that distributes browser tasks across independent operating system processes to ensure stability and prevent site-specific failures from impacting the entire application. The engine incorporates a sandboxed execution environment to restrict web content and untrusted scripts to isolated memory compartments, enforcing security policies that prevent unauthorized access to system resources. The project distinguis

    JavaScript
    View on GitHub↗11,305
  • geist-org/reactgeist-org avatar

    geist-org/react

    4,550View on GitHub↗

    This project is a React UI component library and frontend UI kit designed to provide a collection of pre-styled user interface elements. It serves as a design system framework, offering standardized visual patterns to ensure a cohesive look and feel across different screens. The library focuses on design system implementation and frontend component architecture, allowing for the creation of modern websites and applications. It integrates directly into a React application workflow to accelerate the development of complex web layouts. The system utilizes a component-based abstraction and compo

    TypeScript
    View on GitHub↗4,550