Quick Start

1. Requirements

Before proceeding, you need to have the latest stable node.js
Recommended environment:
  • node js 20+
  • npm js 10+

2. Installation

Open package folder and install its dependencies. We recommended yarn or npm.
Script Project Folder
Install npm
                            
  cd project-folder/package/demos
  npm install
                            
                        
Install Gulp
                            
  npm install --global gulp-cli
                            
                          
Start
                            
  gulp
                            
                          
Build
                            
  gulp build
                            
                          

3. Color Themes

By default, MatDash applies the default theme using the data-color-theme attribute to define the skin option. You can modify it or add your custom skin as needed.

By Default we are giving 6 color themes :

Blue_Theme Aqua_Theme Purple_Theme Green_Theme Cyan_Theme Orange_Theme
                  
  <html lang="en" dir="ltr" data-bs-theme="light" data-color-theme="Blue_Theme" data-layout="vertical">
                  
              

4. Theming

MatDash offers both light and dark style options, with the light style set as the default.

By Default we are giving 2 color themes, you just need to change attribute of data-bs-theme :

light dark
                  
  <html lang="en" dir="ltr" data-bs-theme="dark" data-color-theme="Blue_Theme" data-layout="vertical">
                  
              

5. RTL Supported

MatDash comes with built-in RTL support by default.

To enable RTL direction, add dir="rtl" attribute to the html element.

ltr rtl
                  
  <html lang="en" dir="rtl" data-bs-theme="dark" data-color-theme="Blue_Theme" data-layout="vertical">