❤️ Creative Tim Club - Access all our Present & Future Premium Products
Get Offer ×

Material Dashboard 2 React

Custom development Preview Docs
Download PRO Version
Material Dashboard 2 React Image
Docs
Creative Tim Club 🔥 Access to all our current and future products

Material Dashboard 2 React

Free Material-UI & React Admin Template

· 4.90/5 (554 Reviews)

MIT License

Upgrade to PRO Free Download

Free MUI & React Admin Template

Product description


Material Dashboard 2 React is our newest free MUI Admin Template based on React. If you’re a developer looking to create an admin dashboard that is developer-friendly, rich with features, and highly customisable, here is your match. Our innovative MUI & React dashboard comes with a beautiful design inspired by Google's Material Design and it will help you create stunning websites & web apps to delight your clients.

Fully Coded Elements

Material Dashboard 2 React is built with over 70 frontend individual elements, like buttons, inputs, navbars, nav tabs, cards, or alerts, giving you the freedom of choosing and combining. All components can take variations in color, which you can easily modify using MUI styled() API and sx prop. You will save a lot of time going from prototyping to full-functional code because all elements are implemented.

This free MUI & React Dashboard is coming with prebuilt design blocks, so the development process is seamless, switching from our pages to the real website is very easy to be done.

View all components here.

Documentation built by Developers

Each element is well presented in very complex documentation.

You can read more about the documentation here.

Example Pages

If you want to get inspiration or just show something directly to your clients, you can jump-start your development with our pre-built example pages. You will be able to quickly set up the basic structure for your web project.

View example pages here.

Special thanks

During the development of this dashboard, we have used many existing resources from awesome developers. We want to thank them for providing their tools open source:

  • MUI - The React UI library for faster and easier web development.
  • React ChartJS 2 - Simple yet flexible React charting for designers & developers.
  • ChromaJS - A small-ish zero-dependency JavaScript library for all kinds of color conversions and color scales.
  • Nepcha Analytics for the analytics tool. Nepcha is already integrated with this template. You can use it to gain insights into your sources of traffic.
Product certified by: Creative Tim
Material Dashboard 2 React - Fully Coded and Responsive HTML5
Material Dashboard 2 React - JavaScript library for building user interfaces
Material Dashboard 2 React - Figma Files for Professional Designers
Downloads
199,254
Version
2.2.0
Changelog
view
Updated
10 months ago
Released
6 years ago
Reviews
See 554 Reviews
Star
Handcrafted Elements
70
Customized Plugins
2
Example Pages
8
Community Support
Documentation
Fully Responsive

Upgrade to PRO Version

Get more power with Material Dashboard 2 PRO React. It has a lot more features compared to the free version. We hope you will create awesome websites/templates with this product!

What is in Demo? What is in PRO Version?
Elements 70 200
Plugins 2 12
Examples Pages 8 30
Full Coded
Documentation
SASS Files
Designer Files
Premium Support
Material Dashboard 2 PRO React Image
Live Preview Upgrade to PRO

We are here to help you!

209 Web Developers commented on this product

Custom Development Discord Server

professionallaney
  • downloaded
5 years ago

Hey @einazare, Did you get a chance to finish that redux walkthrough you mentioned above? I would love to take a look. Thanks, Ben

ctmployee
  • downloaded

Hello there @professionallaney . It just got accepted in the freecodecamp medium. Here is the link to it: https://medium.freecodecamp.org/how-to-use-redux-in-reactjs-with-real-life-examples-687ab4441b85 . Best, Manu.
5 years ago

professionallaney
  • downloaded
5 years ago

Hey @einazare, Did you get a chance to finish that redux walkthrough you mentioned above? I would love to take a look. Thanks, Ben

alanooper
  • downloaded
5 years ago

I files an issue as requested: https://github.com/creativetimofficial/material-dashboard-react/issues/76

ctmployee
  • downloaded

Hello there @alanooper . I just realised that you have an issue with the PRO version of this product and not the free one. Please, stop commenting on the free product. It is very hard for me to understand what your issue is, if you comment on the free product, but you have an issue with the PRO one, it confuses me and it takes a lot of my time. Please, next time, be sure to comment on the right product, and open a Github issue as well, on the right repo. Best, Manu.
5 years ago

alanooper
  • downloaded
5 years ago

New question material-dashboard-pro 1.4.0: 1. In views/Forms "Wizard.jsx" is the parent of WizardSteps/{Step1.jsx, Step2.jsx and Step3.jsx} 2. When the "Next" button is pressed, "components/Wizard/Wizard.jsx" nextButtonClick() calls Step1.jsx: sendState() which returns Step1's this.state 3. How does "view/Forms/WizardSteps/Step2.jsx" get the state from Step1.jsx / Wizard.jsx? It can't get it from the constructor's props since it was called before the "Next" button was pressed. I checked: GitHib Issues: Does not appear: https://github.com/creativetimofficial/ct-material-dashboard-pro/issues Live Docs: https://demos.creative-tim.com/material-dashboard-react/#/documentation/tutorial "Views", nor subtopic "Forms" nor subtopic "Wizard" appear in the left side navigation.

alanooper
  • downloaded

Seems to me that the logic is incorrect in Wizard.jsx nextButtonClick() this.state.allStates should have the state data from Step1.jsx after the Next button is pressed, however it is always {} I added this following code and I can see the state: let currentStepState = { [this.props.steps[this.state.currentStep].stepId]: this[ this.props.steps[this.state.currentStep].stepId ].sendState() }; alert("currentStepState:" + JSON.stringify(currentStepState)); Subsequently I think the if statements above are not quite right. Alan S. Cooper
5 years ago

alanooper
  • downloaded

I now think that the if statements are ok, It seems to me that this.setState({ allStates: [ ...this.state.allStates, { [this.props.steps[i].stepId]: this[ this.props.steps[i].stepId ].sendState() } ] }); itself is not working? Also in the constructor, shouldn't default be allStates = [] and not {}?
5 years ago

alanooper
  • downloaded
5 years ago

I found the bug in "components/Wizard/Wizard.jsx: Lines 48 and 49 are duplicated: this.previousButtonClick = this.previousButtonClick.bind(this); this.previousButtonClick = this.previousButtonClick.bind(this); Should be: this.nextButtonClick = this.nextButtonClick.bind(this); this.previousButtonClick = this.previousButtonClick.bind(this);

alanooper
  • downloaded
5 years ago

waited long enough for a response, filed an issue for this bug: https://github.com/creativetimofficial/material-dashboard-react/issues/78

ctmployee
  • downloaded

Hello there @alanooper . Sorry for the long wait, but we've updated our support privacy and policy, and the issues filed for the free products on Github, on the product page (this page that you are now on) and the issues filled on our contact form, are of low priority to us. I've also asked you to open the issues on the right product page, ticket or Github repo. I hope you can understand our situation. Best, Manu.
5 years ago

alanooper
  • downloaded
5 years ago

Hello Manu, I understand. In GitHub, you can transfer an issue from one repo to another so that the history is preserved: View the issue, then on the bottom of the right side navigation base, click "Transfer this issue" Beta. Works well in my experience. With respect to issue https://github.com/creativetimofficial/material-dashboard-react/issues/78 I solved it and am no longer blocked by this I am simply offering you the solution for your other paying customers.

ctmployee
  • downloaded

Hello again @alanooper . Thank you for your suggestion. Best, Manu.
5 years ago

rohithore
  • downloaded
5 years ago

Is redux and saga implemented?

ctmployee
  • downloaded

Hello there @rohithore and thank you for your interest in working with our products. No, we do not have redux or saga implemented, to be honest, I haven't worked with saga. But we have made a Redux tutorial, you can read it here and see if it helps you: https://medium.freecodecamp.org/how-to-use-redux-in-reactjs-with-real-life-examples-687ab4441b85 . Best, Manu.
5 years ago

protoniz
  • downloaded
5 years ago

Hello, is this free version also available for commercial usage? Thanks in advance

ctmployee
  • downloaded

Hello there @protoniz and thank you for your interest for working with our product. This product is MIT licensed, so it falls in that category of usage. You can read more about MIT here: https://opensource.org/licenses/MIT. Best, Manu.
5 years ago

bpsr06 5 years ago

hello. The mouse scrollbar doesn't work when it comes to navpills. Why didn't I find it? Thanks

ctmployee
  • downloaded

Hello there @bpsr06 and thank you for your interest in working with our products. I am sorry to say this, but on this product, there is no NavPills component. Ar you sure you have commented on the right product? Best, Manu.
5 years ago

You have to be logged in to post a comment. Login here.

  1. Home
  2. All Templates
  3. Material Dashboard 2 React

2,481,569 accounts

4,405,161 downloads

298 products

Join our newsletter

Your subscription could not be saved. Please try again.
Your subscription has been successful.

Company

Help and Support

Legal

Resources

© 2024 Creative Tim, all rights reserved. Made with for a better web.