A Free React Admin Template With Material Design And Tailwind CSS

Material Tailwind Dashboard React

Free and Open Source Admin for Tailwind CSS and React based on Google's Material Design.

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.

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