I found the amount of UI toolkits for React impressive, so I wanted to share what I found.
I found 18 UI kits and checked how many stars on GitHub and weekly downloads on NPm they have.
They are sorted by GitHub stars.
Ant Design
A design system with values of Nature and Determinacy for the better user experience of enterprise applications
Creator: XTech
License: MIT
NPM: ~506.403 weekly downloads
Material-UI
React components that implement Google's Material Design.
Creator: Community
License: MIT
NPM: ~1.479.000 weekly downloads
Blueprint
A React based UI toolkit for the web.
Creator: Palantir
License: BLUEPRINT LICENSE (based on Apache 2.0 License)
NPM: ~142.300 weekly downloads
Material Components
Build beautiful, usable products with Material Components for iOS, Android, web, and Flutter.
Creator: Google
License: MIT
NPM: ~116.000 weekly downloads
Semantic UI React
Semantic UI React is the official React integration for Semantic UI.
Creator: Community
License: MIT
NPM: ~188.000 weekly downloads
Evergreen
A React UI Framework for building ambitious products on the web.
Creator: Segment
License: MIT
NPM: ~7.400 weekly downloads
Fluent UI
A collection of UX frameworks for creating beautiful, cross-platform apps that share code, design, and interaction behavior.
Creator: Microsoft
License: MIT
NPM: ~22.200 weekly downloads
Grommet
focus on the essential experience
Creator: Community
License: Apache License 2.0
NPM: ~22.500 weekly downloads
Reakit
Toolkit for building really interactive UIs with React.
Creator: Community
License: MIT
NPM: ~60.100 weekly downloads
Polaris
Our design system helps us work together to build a great experience for all of Shopify’s merchants.
Creator: Shopify
License: MIT
NPM: ~79.800 weekly downloads
Lightning Design System
Create the world’s best enterprise app experiences.
Creator: Salesforce
License: Custom
NPM: ~10 weekly downloads
Element
Element, a Vue 2.0 based component library for developers, designers, and product managers (Forked and rewritten in React)
Creator: Community
License: MIT
NPM: ~7.300 weekly downloads
Ring UI
This collection of UI components aims to provide all of the necessary building blocks for web-based products built inside JetBrains, as well as third-party plugins developed for JetBrains' products.
Creator: JetBrains
License: Apache License 2.0
NPM: ~2.100 weekly downloads
Elastic UI framework
The Elastic UI framework is a design library in use at Elastic to build internal products that need to share our aesthetics.
Creator: Elastic
License: Apache License, Version 2.0
NPM: ~13.900 weekly downloads
PrimeReact
The Most Complete UI Framework for REACT
Creator: Primetek
License: MIT
NPM: ~19.300 weekly downloads
Shards React
A high-quality & free React UI kit featuring a modern design system with dozens of custom components.
Creator: Designrevision
License: MIT
NPM: ~2.300 weekly downloads
Instructure-UI
Instructure-UI has a number of beautiful and accessible React components with baked-in styles and theming and helpful utility functions.
Creator: Instructure
License: MIT
NPM: ~175 weekly downloads
Lucid UI
Lucid UI is a React component library by AppNexus.
Creator: Xandr
License: Apache License, Version 2.0
NPM: ~400 weekly downloads
Learn React with my Book
If you like understanding how React works by taking it apart, then you might like my book React From Zero. In the book, I dissect how React works by examining how components work, how elements are rendered, and how to create your own Virtual DOM.
Oldest comments (25)
This is one cool evergreen
Yes, looks interesting. :)
At the moment: None of them.
I just looked into them. Until now I hand-rolled all my UIs with plain React.
Thanks, this is a great overview of what's available out there. Looks like the bigger the supporting company is, the bigger is the set of components to choose from in their ui kit. The most complete and thoroughly designed seem to be:
So far I only used Material UI. Shopify's set is smaller than I thought. And I wonder why JetBrains has a web UI kit at all, since their primary products are Java based fat client applications.
I will check out Elastic UI and Lightning in the next days.
Yes, I was blown away by all these companies. Salesforce and JetBrains... who would have thought?
Thanks for this!
I've only tried Semantic UI, but I'm looking forward to giving these a try!
Nice resources, also check some publicly available design systems and pattern libraries
I really like the composability of Reakit as that solves the issue a lot of UI component frameworks tend to have in not being flexible enough. Although personally the only React one I used so far was Material-UI v1.
However, I think it's better in the long term to create your own components and use primitive helpers like Downshift to reuse complex behavior with your own styling applied.
You're right.
I used Bootstrap because it felt really flexible and then, when I started using React, I switched to React-Bootstrap, but it didn't feel as powerfull as plain CSS-Bootstrap, so dropped it again and did my own components with CSS-Bootstrap.
Is your library available on GitHub, I would like to try it because we also create our own Bootstrap CSS based library for React.js github.com/coreui/coreui-react/
I didn't do a library. I use react-bootstrap and then I did "hand rolled components" for all my apps where I dropped bootstrap class names right inside the React components.
That looks really nice. Thanks for sharing~
I use Ant Design at work, it is really good.
I love Ant Design. Components and documentation are amazing 😊
Really nice comprehensive list, and includes quite a few that aren't normally mentioned which is great. Thanks!
You are welcome 😬
I've used Grommet and Material UI.
I'm not a huge fan of these but I can see why people use them.
This is a young project but definitely the most promising imo
ui.reach.tech/
Ryan Florence's project, it's all about accessibility and composition.
Nice to work with, easy to style. If I had to use one again, this is the one I would pick.
Just my 2 cents 🍾
how can i create my one ui kit for react native ?
Look at the github repositories here, they can be used as inspiration! :)
If I don't go wrong Atlassian Kit is not intended for general use, the license state that it can only be used to create products connected with the Atlassian eco-system, be careful :)
Classic Atlassian, thanks!
We started the development of ebs-design, it's a young alternative for enterprise applications UI Kits.
good job, keep it up!
Speaking of UI-kit, the article gapsystudio.com/blog/what-is-a-ui-... should be mentioned, this is a useful material for beginners, which will give a clear understanding of the functioning of the ui kit and its benefits.