Material Design ReactJS Admin Web App with Bootstrap 4

Material Design ReactJS Admin Web App with Bootstrap 4

Admin preview


Material is a Google material design inspired admin template built with ReactJS & Bootstrap 4. It uses Scss CSS which makes it easy to customize.


  • 2 in 1. Admin template & Landing page
  • Google Material Design
  • Responsive Design
  • Light, Gray and Dark Themes
  • Mutiple Layouts
  • Multiple Color Schemes, with 18 predefined schemes
  • Powerful Layout Settings
  • 900+ official material design icons
  • Sass/Scss CSS, easily update style by changing a few variables
  • Modular Code, add & remove with ease
  • Work with jQuery
  • Nested routing with React-router
  • Lazy loading (Dynamic routing) Support
  • ES6 (ECMAScript6) with Babel
  • Package mangement with NPM
  • Modules bundling with Webpack 2
  • Airbnb React/JSX Style Guide
  • Cross Browser Support
  • High Resolution Support
  • Premium Support
  • Free Future Updates
  • And more


  • Bootstrap the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.
  • ReactJS A declarative, efficient, and flexible JavaScript library for building user interfaces.
  • React-router the most popular router in the React ecosystem
  • Redux the most popular and well-documented Flux library
  • Material UI a set of React components that implement Google’s Material Design specification.
  • Babel Use next generation JavaScript, today.
  • Webpack webpack is a bundler for modules.
  • jQuery Write less, do more


Version 1.2.3

- Feat: Update NPM packages
- Fix: Fix "PropTypes is deprecated" warning
- Refactor: Change indentation from 4 spaces to 2 spaces 
- Refactor: Refact code and update settings to pass ESLint

Version 1.2.1 (04-10-2017)

- Feat: Update NPM packages to latest version
- Feat: Add collapsedSidebar toggler next to logo
- Chores

Version 1.2.0 (04-02-2017)

- Feat: Add animation
- Feat: Upgrade NPM packages to latest version
- Feat: Add "yarn.lock", so that others can get precisely the same dependencies. (If you don't wanna use Yarn, simply ignore it and keep using NPM), thanks @pwhuh
- Docs: Update the documentation
- Refactor: Change ‘require’ to ‘import’

Version 1.1.0 (03-26-2017)

- Feat: Add Landing page template

Version 1.0.1 (03-22-2017)

- Feat: Add more UI components
- Feat: Update NPM packages to latest version
- Docs: Update the documentation

Version 1.0.0 (03-22-2017)

- Initial release