What is Material-UI?

It is a comprehensive guide for visual, motion, and interaction design across platforms and devices. React components for faster and easier web development. Build your own design system, or start with Material Design.

Our Mission

Our company is focused on making React UIs development easier, better, and accessible to more people. We build open source and commercial tools used by many hundreds of thousands of developers in production. We’re proud not only of the products we make, but also the community and partnerships we’ve cultivated with other developers and companies.

Our Vision

Our vision is to provide React components for faster and easier web development. Our vision is to provide an elegant React implementation of the Material Design guidelines that can be customized to fully match your brand.

The Material Design guidelines are an incredible starting point, but they do not provide guidance on all aspects or needs of an application. In addition to the guidelines-specific implementation, we want Material-UI to become whatever is generally useful for application development, all in the spirit of the Material Design guidelines.

Therefore, Material-UI will be not only be an implementation of the Material Design guidelines, but a general use UI library of components that are needed by many. This generalized use doesn’t imply any other design methodology. It also means we will have components or combinations that are simply not addressed in the design guidelines.

We will focus on providing all the low-level tools needed to build a rich user-interface with React. Once we implement the Material Design specification (which is a bar set quite high), you should be able to take advantage of it for your own business with any style customization needed. We want to see companies succeeding using Material-UI in a way that matches their brand, close to the material philosophy or not. We don’t want them to feel that their UI simply looks like another Google product.

From a developer’s point of view, we want Material-UI to:

  • Deliver on fully encapsulated / composable React components.
  • Be themeable / customizable.
  • Be cross browser compatible and accessible.
  • Promote developer joy, a sense of community, and an environment where new and experienced developers can learn from each other.

Our Values

Our core values include transparency (our work is public most of the time); creating a safe, high-trust team; building incredible developer experiences; maintaining a healthy working environment; and helping to deliver web experiences that feel amazing to use on every device and connection type.

Our Story

Material-UI started back in 2014 to unify React and Material Design.

Today, Material-UI has grown to become one of the world’s most popular React UI libraries – backed by a vibrant community of more than 1M developers in over 180 countries.


Install Material-UI’s source files via npm. We take care of injecting the CSS needed.

$ npm install @material-ui/core

or use a CDN. Load the default Roboto font.

<link rel="stylesheet" href=",400,500,700&display=swap" />


Material-UI components work without any additional setup, and don’t pollute the global scope.

import React from 'react';
import { Button } from '@material-ui/core';

function App() {
  return <Button color="primary">Hello World</Button>;