Create a Customized Color Theme in Material-UI

Making a custom color theme for your next React project is easy

Chad Murobayashi
The Startup

--

Photo by Sharon McCutcheon on Unsplash

I recently started using Material-UI for all of my React projects and have been enjoying how easy it is to build beautiful interfaces. In this article, I want to explain how to get started with Material-UI and customize a color palette theme to use for your next project.

What is Material-UI?

Material-UI is a React UI framework that follows the principles of Material design. Material design is a design system created by Google. If you are interested to learn more about Material Design, have a look at the video below.

What I like about Material-UI is that it makes customization easy. You can easily change colors, typography, spacing, and more in individual components or globally by customizing the theme. Let’s get started!

Getting Started

First off, I will assume that you are able to set up a basic react app. The easiest way will be to use…

--

--

Chad Murobayashi
The Startup

Software Engineer living in Tokyo, Japan. Born and raised in Hawaii.