Skip to content

creativetimofficial/material-tailwind-dashboard-react

Repository files navigation

version GitHub issues open GitHub issues closed

Image

Material Tailwind Dashboard React is a free Admin Template based on two popular front-end technologies: Tailwind CSS & React. It was built to simplify the developer's work and is comes with a fresh design inspired by Google's Material Design. All its components are built to fit perfectly with each other, while aligning to the material concepts.

Save weeks of time and build your perfect dashboard with this powerful template! It features 120 fully coded components and 4 example pages if you want to get inspiration or just show something directly to your clients. This beautiful admin also 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.

Material Tailwind Dashboard React is built based on our very popular Material Kit (https://www.creative-tim.com/product/material-kit). It makes use of light, surface and movement. The general layout resembles sheets of paper following multiple layers, so that the depth and order is obvious. Inside the archive you will find multiple example pages on how to use all components. And, of course, every element is well-documented.

Table of Contents

Versions

React

| Material Tailwind Dashboard React

Demo

Quick start

Quick start options:

Terminal Commands

  1. Download and Install NodeJs from NodeJs Official Page.
  2. Navigate to the root / directory and run npm install or (yarn install, if you're using yarn) to install our local dependencies.

Documentation

Material Tailwind Dashboard React build using Material Tailwind and the documentation of Material Tailwind is hosted at Material Tailwinl.

What's included

Within the download you'll find the following directories and files:

Material Tailwind Dashboard React
    ├── material-tailwind-dashboard-react
    │   ├── public
    │   │   ├── index.html
    │   │   ├── favicon.ico
    │   │   └── apple-icon.png
    │   ├── src
    │   │   ├── assets
    │   │   │   ├── img/
    │   │   │   └── styles/
    │   │   ├── components
    │   │   │   ├── AdminNavbar.js
    │   │   │   ├── ChartBar.js
    │   │   │   ├── ChartLine.js
    │   │   │   ├── Footer.js
    │   │   │   ├── MapExample.js
    │   │   │   ├── PageVisitsCard.js
    │   │   │   ├── ProfileCard.js
    │   │   │   ├── SettingsForm.js
    │   │   │   ├── Sidebar.js
    │   │   │   ├── StatusCard.js
    │   │   │   ├── TableCard.js
    │   │   │   └── TrafficCard.js
    │   │   ├── Pages
    │   │   │   ├── Dashboard.js
    │   │   │   ├── Maps.js
    │   │   │   ├── Settings.js
    │   │   │   └── Tables.js
    │   │   ├── App.js
    │   │   ├── App.test.js
    │   │   ├── index.js
    │   │   ├── reportWebVitals.js
    │   │   └── setup.test.js
    │   ├── CHANGELOG.md
    │   ├── jsconfig.json
    │   ├── LICENSE
    │   ├── package.json
    │   ├── postcss.config.js
    │   ├── README.md
    │   ├── tailwind.config.js
    │   ├── yarn.lock

Browser Support

At present, we officially aim to support the last two versions of the following browsers:

Resources

Reporting Issues

We use GitHub Issues as the official bug tracker for the Material Tailwind Dashboard React. Here are some advices for our users that want to report an issue:

  1. Make sure that you are using the latest version of the Material Tailwind Dashboard React. Check the CHANGELOG from your dashboard on our website.
  2. Providing us reproducible steps for the issue will shorten the time it takes for it to be fixed.
  3. Some issues may be browser specific, so specifying in what browser you encountered the issue might help.

Technical Support or Questions

If you have questions or need help integrating the product please contact us instead of opening an issue.

Licensing

Useful Links

Social Media

Twitter: https://twitter.com/CreativeTim

Facebook: https://www.facebook.com/CreativeTim

Dribbble: https://dribbble.com/creativetim

Google+: https://plus.google.com/+CreativetimPage

Instagram: https://instagram.com/creativetimofficial