The best material-web alternatives

beercss

beercss/beercss

Build material design interfaces in record time... without stress for devs... 🍺💛

Choose beercss if…

• you would rather work in Vue than SCSS
• MIT License suits your use better than Apache License 2.0
• you prefer a smaller, narrower project to a large one
• you specifically need css or html

Shares design-system, material, material-you, web with material-web.

system-design-primer

donnemartin/system-design-primer

Learn how to design large-scale systems. Prep for the system design interview. Includes Anki flashcards.

Choose system-design-primer if…

• you would rather work in Python than SCSS
• you want the more widely starred option (376.7k)
• you specifically need design or design-patterns

Shares design-system, web with material-web.

material-ui

mui/material-ui

Material UI: Comprehensive React component library that implements Google's Material Design. Free forever.

Choose material-ui if…

• you would rather work in JavaScript than SCSS
• MIT License suits your use better than Apache License 2.0
• you want the more widely starred option (99.3k)
• you specifically need material-ui or react

Shares design-system, material-design with material-web.

vuetify

vuetifyjs/vuetify

🐉 Vue Component Framework

Choose vuetify if…

• you would rather work in TypeScript than SCSS
• you want the more widely starred option (41.0k)
• you specifically need javascript or material-components

Shares material, material-design with material-web.

material-design-for-bootstrap

mdbootstrap/material-design-for-bootstrap

Important! A new UI Kit version for Bootstrap 5 is available. Access the latest free version via the link below.

Choose material-design-for-bootstrap if…

• you would rather work in JavaScript than SCSS
• MIT License suits your use better than Apache License 2.0
• you specifically need bootstrap or bootstrap-4

Shares material, material-design with material-web.

system-design-and-architecture

puncsky/system-design-and-architecture

Learn how to design large-scale systems. Prep for the system design interview.

Choose system-design-and-architecture if…

• you would rather work in Makefile than SCSS
• you prefer a smaller, narrower project to a large one
• you specifically need architecture or design

Shares design-system, web with material-web.

react-md

mlaursen/react-md

React material design - An accessible React component library built from the Material Design guidelines in Sass

Choose react-md if…

• you would rather work in TypeScript than SCSS
• MIT License suits your use better than Apache License 2.0
• you prefer a smaller, narrower project to a large one
• you specifically need accessibility or component-library

Shares material, material-design with material-web.

daisyui

saadeghi/daisyui

🌼 🌼 🌼 🌼 🌼  The most popular, free and open-source Tailwind CSS component library

Choose daisyui if…

• you would rather work in JavaScript than SCSS
• MIT License suits your use better than Apache License 2.0
• you want the more widely starred option (42.7k)
• you specifically need component or component-library

Shares design-system with material-web.

chakra-ui

chakra-ui/chakra-ui

Chakra UI is a component system for building SaaS products with speed ⚡️

Choose chakra-ui if…

• you would rather work in TypeScript than SCSS
• MIT License suits your use better than Apache License 2.0
• you want the more widely starred option (40.7k)
• you specifically need a11y or accessible

Shares design-system with material-web.

TW-Elements

mdbootstrap/TW-Elements

𝙃𝙪𝙜𝙚 collection of Tailwind MIT licensed (free) components, sections and templates 😎

Choose TW-Elements if…

• you would rather work in JavaScript than SCSS
• MIT License suits your use better than Apache License 2.0
• you specifically need css or dashboard-templates

Shares material-design with material-web.

core

stenciljs/core

A toolchain for building scalable, enterprise-ready component systems on top of TypeScript and Web Component standards. Stencil components can be distributed natively to React, Angular, Vue, (+ more) and traditional web applications from a single, framework-agnostic codebase.

Choose core if…

• you would rather work in TypeScript than SCSS
• you specifically need custom-element or ionic

Shares design-system with material-web.

css

primer/css

Primer is GitHub's design system. This is the CSS implementation

Choose css if…

• MIT License suits your use better than Apache License 2.0
• you specifically need css or design-systems

Shares design-system with material-web.