This project's goal is to help create extremely customizable and fully accessible React components matching the guidelines from https://www.w3.org along with the Material Design principals. The main difference between this library and material-ui is how the styles are provided. This library is focused more towards developers that like Sass instead of CSS-in-JS solutions.
Before choosing this library, please note that this project is maintained by a single developer as a side project. This means that new releases and bugfixes will be fairly slow.
The base react-md
package (non-scoped) is the only package that also provides
pre-built css themes and a UMD bundle. If you are interested in seeing what an
estimated size for this library, check out the results below:
yarn dev-utils libsize
The gizipped UMD bundle sizes are:
- dist/umd/react-md.production.min.js 86.98 KB
- dist/umd/react-md-with-font-icons.production.min.js 111.26 KB
- dist/umd/react-md-with-svg-icons.production.min.js 177.04 KB
The min and max gzipped CSS bundle sizes are:
- themes/react-md.grey-red-700-light.min.css 17.57 KB
- themes/react-md.lime-teal-200-dark.min.css 17.63 KB
This library is targeted to support all evergreen browsers as well as browsers that support css variables. This means there is no IE 11 support for dynamic themes, but it should at least not crash in IE 11.
If you'd still like to use this library even with the warnings above, I'd recommend starting by looking through the demos for all the packages to see what type of components are available:
From there, it would be good to go through some of the guides: