UI Frameworks

Open-source projects categorized as UI Frameworks

Top 23 UI Framework Open-Source Projects

  • Material UI

    Ready-to-use foundational React components, free forever. It includes Material UI, which implements Google's Material Design.

  • Project mention: 6 CSS tools for more efficient and flexible CSS handling | dev.to | 2024-05-16

    The first tool we’ll look at is Pigment CSS, a zero-runtime CSS-in-JS library built to extract the co-located styles into separate CSS files during the build phase and eliminate the need for runtime style processing.

  • antd

    An enterprise-class UI design language and React UI library

  • Project mention: Open Source Admin Dashboard Starter: Ant Design v5, TypeScript, MongoDB | dev.to | 2024-05-15

    Built with Ant Design 4 and ProComponents

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • chakra-ui

    ⚑️ Simple, Modular & Accessible UI Components for your React Applications

  • Project mention: How I Build Paradise UI: A React UI Component Library | dev.to | 2024-05-14

    If you know Material UI, Chakra UI or Primereact, those are react UI component libraries.

  • react-admin

    A frontend Framework for building data-driven applications running on top of REST/GraphQL APIs, using TypeScript, React and Material Design

  • Project mention: Ask HN: Does Anyone Use a "Closed Core" Software Model? | news.ycombinator.com | 2024-04-16

    > "Are there examples of companies adopting this model?"

    Many examples across the industry:

    - Autodesk AutoCAD (closed) + Plugins/Addons (many open)

    - MS Windows (closed) + Many 3rd party programs (open)

    - Github (closed) + Github Actions (open)

    - Npm (closed) + Npm modules (mostly open)

    > "What are the potential benefits or pitfalls?"

    Benefits:

    - Harder to replicate, the company gets to keep the "secret sauce" a secret

    - Opening up a way to "extend" the platform means 3rd party developers add value to your system

    - The core isn't open, so less effort is required to maintain compare to OpenSource

    Pitfalls:

    - Closed-source is hard to verify, company is essentially saying "trust me bro"

    - Less innovation, as user's can't contribute to the core

    > "How does it impact community engagement and software adoption?"

    There's hardcore FOSS advocates that will hate anything not fully open. But a business has to make money and protect it's IP, having a "closed core" is one way to do that and ensure a sustainable business model.

    Another approach is the opposite, open-core + closed-premium-addons. An example of this is "React Admin"

    - Open Core -> https://github.com/marmelab/react-admin

    - Premium Modules Offering -> https://react-admin-ee.marmelab.com/

  • react-bootstrap

    Bootstrap components built with React

  • Project mention: 9 React component libraries for efficient development in 2023 | dev.to | 2023-11-13

    GitHub stars: 22k GitHub link: https://github.com/react-bootstrap/react-bootstrap Documentation: https://react-bootstrap.netlify.app/docs/getting-started/introduction/

  • @blueprintjs/core

    A React-based UI toolkit for the web

  • Project mention: React Component Libraries | dev.to | 2024-03-13

    Official Website: https://blueprintjs.com/

  • office-ui-fabric-react

    Fluent UI web represents a collection of utilities, React components, and web components for building web applications.

  • Project mention: Making Web Component properties behave closer to the platform | dev.to | 2024-01-21

    For example, all the following design systems can be used without tooling (some of them provide ready-to-use bundles, others can be used through import maps): Google's Material Web, Microsoft's Fluent UI, IBM's Carbon, Adobe's Spectrum, Nordhealth's Nord, Shoelace, etc.

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

    InfluxDB logo
  • semantic-ui-react

    The official Semantic-UI-React integration

  • Project mention: React Component Libraries | dev.to | 2024-03-13

    Official Website: https://react.semantic-ui.com/

  • evergreen

    🌲 Evergreen React UI Framework by Segment

  • Project mention: ⚑Top GitHub Repositories for UI Components | dev.to | 2024-01-05

    πŸ” Site ⭐ GitHub

  • antd-mobile

    Essential UI blocks for building mobile web apps.

  • reactstrap

    Simple React Bootstrap 5 components

  • react-desktop

    React UI Components for macOS High Sierra and Windows 10

  • onsenui

    Mobile app development framework and SDK using HTML5 and JavaScript. Create beautiful and performant cross-platform mobile apps. Based on Web Components, and provides bindings for Angular 1, 2, React and Vue.js.

  • Project mention: React Component Libraries | dev.to | 2024-03-13

    Official Website: https://onsen.io/

  • react-toolbox

    A set of React components implementing Google's Material Design specification with the power of CSS Modules

  • base web

    A React Component library implementing the Base design language

  • Project mention: ⚑Top GitHub Repositories for UI Components | dev.to | 2024-01-05

    πŸ” Site ⭐ GitHub

  • grommet

    a react-based framework that provides accessibility, modularity, responsiveness, and theming in a tidy package

  • Project mention: 9 React component libraries for efficient development in 2023 | dev.to | 2023-11-13

    GitHub stars: 8.3k GitHub link: https://github.com/grommet/grommet Documentation: https://v2.grommet.io/docs

  • rsuite

    🧱 A suite of React components .

  • Project mention: React Component Libraries | dev.to | 2024-03-13

    Official Website: https://rsuitejs.com/

  • rebass

    :atom_symbol: React primitive UI components built with styled-system.

  • semi-design

    πŸš€A modern, comprehensive, flexible design system and React UI library. 🎨 Provide more than 2800+ Design Tokens, easy to build your design system. Make Semi Design to Any Design. πŸ§‘πŸ»β€πŸ’» Design to Code in one click

  • reakit

    Toolkit for building accessible web apps with React

  • Project mention: ⚑Top GitHub Repositories for UI Components | dev.to | 2024-01-05

    πŸ” Site ⭐ GitHub

  • carbon

    A design system built by IBM (by carbon-design-system)

  • Project mention: 10+ UI Libraries for Svelte to Try in 2024 | dev.to | 2024-05-14

    Carbon Components is a Svelte component library that is built on top of the Carbon Design System, an open source design system by IBM. The components look very minimalistic (especially styling based on gray color saturation) but probably would fit in some business-looking app. In defense it must be said that the library offers a big number of Svelte components with advanced functionality.

  • primereact

    The Most Complete React UI Component Library

  • Project mention: How I Build Paradise UI: A React UI Component Library | dev.to | 2024-05-14

    If you know Material UI, Chakra UI or Primereact, those are react UI component libraries.

  • searchkit

    Search UI for Elasticsearch & Opensearch. Compatible with Algolia's Instantsearch and Autocomplete components. React & Vue support

  • Project mention: Autocomplete – a JavaScript library for building autocomplete experiences | news.ycombinator.com | 2023-06-07

    https://github.com/searchkit/searchkit is an instantsearch adapter for elasticsearch / opensearch

  • SaaSHub

    SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives

    SaaSHub logo
NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020).

UI Frameworks related posts

  • 6 CSS tools for more efficient and flexible CSS handling

    4 projects | dev.to | 16 May 2024
  • Open Source Admin Dashboard Starter: Ant Design v5, TypeScript, MongoDB

    2 projects | dev.to | 15 May 2024
  • How I Build Paradise UI: A React UI Component Library

    7 projects | dev.to | 14 May 2024
  • Ask HN: Does Anyone Use a "Closed Core" Software Model?

    1 project | news.ycombinator.com | 16 Apr 2024
  • Ask HN: Features for GPU price-per-hour tracker for A100/H100s

    1 project | news.ycombinator.com | 14 Apr 2024
  • Top 5 UI Component Libraries for React.js

    1 project | dev.to | 11 Apr 2024
  • Exploring 5 Top UI Frameworks for React

    1 project | dev.to | 26 Mar 2024
  • A note from our sponsor - InfluxDB
    www.influxdata.com | 19 May 2024
    Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality. Learn more β†’

Index

What are some of the best open-source UI Framework projects? This list will help you:

Project Stars
1 Material UI 91,834
2 antd 90,438
3 chakra-ui 36,708
4 react-admin 24,147
5 react-bootstrap 22,217
6 @blueprintjs/core 20,443
7 office-ui-fabric-react 17,750
8 semantic-ui-react 13,187
9 evergreen 12,337
10 antd-mobile 11,441
11 reactstrap 10,571
12 react-desktop 9,499
13 onsenui 8,790
14 react-toolbox 8,675
15 base web 8,638
16 grommet 8,302
17 rsuite 8,174
18 rebass 7,931
19 semi-design 7,947
20 reakit 7,653
21 carbon 7,493
22 primereact 5,862
23 searchkit 4,719

Sponsored
SaaSHub - Software Alternatives and Reviews
SaaSHub helps you find the best software and product alternatives
www.saashub.com