React Dashboard - Material Design

Hello Coders,

This article presents an open-source React Dashboard crafted by Creative-Tim agency inspired from Google's Material Design: React Dashboard Material. The product has more 100k downloads and based on the permissive license can be used for unlimited hobby and commercial projects.

Thanks for reading! The content is provided by AppSeed, a platform that helps developers to code their projects faster.

• React Dashboard Material - product page
• React Dashboard Material PRO - for more pages and components
• More React Dashboards - a popular article published on Dev.to

Product description

Material Dashboard React is a free Material-UI Admin with a fresh, new design inspired by Google's Material Design. We are very excited to introduce our take on the material concepts through an easy to use and beautiful set of components. Material Dashboard React was built over the popular Material-UI v4.1.0 framework.

Material Dashboard React makes use of light, surface and movement. The general layout resembles sheets of paper following multiple different layers, so that the depth and order is obvious. The navigation stays mainly on the left sidebar and the content is on the right inside the main panel.

Material Dashboard React comes with 5 color filter choices for both the sidebar and the card headers (blue, green, orange, red and purple) and an option to have a background image on the sidebar.

How to compile from sources

As mentioned, the project can be downloaded directly from Github and compiled locally with a commands typed in the console.

Note: To successfully execute the commands, make sure you have properly installed Nodejs and GIT command tool.

Step #1 - Clone the sources of React Dashboard Material

$ git clone https://github.com/creativetimofficial/material-dashboard-react.git
$ cd material-dashboard-react

Step #2 - Install dependencies (using Yarn)

$ # Install modules
$ yarn

Step #3 - Start the template for development

$ # Compile for development
$ yarn start

Once you have finished the development, for the production build use the `built` target:

$ # Compile for production
$ yarn build

That was easy, right? Below are some screens rendered by this modern material design:

React Dashboard - Google Maps

React Dashboard - RTL Support

Thanks for reading! The product comes with a PREMIUM version that you might want to check out: React Dashboard Material PRO

Material Dashboard PRO React is a Premium Material-UI@4.1.0 Admin with a fresh, new design inspired by Google's Material Design. We are very excited to introduce our take on the material concepts through an easy to use and beautiful set of components. Material Dashboard PRO React was built over the popular Material-UI framework.

Material Dashboard PRO React comes with 7 color filter choices for the links of the Sidebar (blue, green, orange, red, purple, rose, white), 3 filter color choices for background of the Sidebar (white, blue`, black), an option to have a background image on the Sidebar and 6 color filter choices the card headers (blue, green, orange, red, purple, rose).

Product Page - React Dashboard Material PRO