Valex React + vite Admin & Dashboard Template

Note:-

Please refer Faq'spage in documentation itself for queries of customization like colors,rtl ,dark,styles,etc..

Theme Styles
Primary Color For All Themes

How to Change Primary Color for All Themes (Light, Dark, Transparent)?

Please follow the below steps to change Primary Color
Step 1 :

To change Primary Color you have to open _bootstrap-styles.scss file and replace what color you want as shown in below

Rootpath : _bootstrap-styles.scss (assets/scss/bootstrap/_bootstrap-styles.scss )

Step 2 :

Note : After Changing color you must run gulp command i.e, gulp watch . Refer gulp page for more gulp commands click here.

Light Theme Style

If you want to change Light Theme color you need to follow the below process. Below are the background color, text color and border color of Light Theme. Please follow the below process.

How to Change Light Background Color?

Please follow the below steps to change Light Background Color
Step 1 :

To change Light Background Color you have to open _variables.scss file and replace what color you want as shown in below

Rootpath : _variables.scss (assets/scss/_variables.scss )

Step 2 :

Note : After Changing color you must run gulp command i.e, gulp watch . Refer gulp page for more gulp commands click here.

How to Change Light Text Color?

Please follow the below steps to change Light Text Color
Step 1 :

To change Light Text Color you have to open _variables.scss file and replace what color you want as shown in below

Rootpath : _variables.scss (assets/scss/_variables.scss )

Step 2 :

Note : After Changing color you must run gulp command i.e, gulp watch . Refer gulp page for more gulp commands click here.

How to Change Light Border Color?

Please follow the below steps to change Light Border Color
Step 1 :

To change Light Border Color you have to open _variables.scss file and replace what color you want as shown in below

Rootpath : _variables.scss (assets/scss/_variables.scss )

Step 2 :

Note : After Changing color you must run gulp command i.e, gulp watch . Refer gulp page for more gulp commands click here.

Dark Theme Style

If you want to change Dark Theme color you need to follow the below process. Below are the body color, theme color, border color and text color of Dark Theme. Please follow the below process.

How to Change Dark body Color?

Please follow the below steps to change Dark body Color
Step 1 :

To change Dark body Color you have to open _variables.scss file and replace what color you want as shown in below

Rootpath : _variables.scss (assets/scss/_variables.scss )

Step 2 :

Note : After Changing color you must run gulp command i.e, gulp watch . Refer gulp page for more gulp commands click here.

How to Change Dark Theme Color?

Please follow the below steps to change Dark Theme Color
Step 1 :

To change Dark Theme Color you have to open _variables.scss file and replace what color you want as shown in below

Rootpath : _variables.scss (assets/scss/_variables.scss )

Step 2 :

Note : After Changing color you must run gulp command i.e, gulp watch . Refer gulp page for more gulp commands click here.

How to Change Dark Border Color?

Please follow the below steps to change Dark Border Color
Step 1 :

To change Dark Border Color you have to open _variables.scss file and replace what color you want as shown in below

Rootpath : _variables.scss (assets/scss/_variables.scss )

Step 2 :

Note : After Changing color you must run gulp command i.e, gulp watch . Refer gulp page for more gulp commands click here.

How to Change Dark Text Color?

Please follow the below steps to change Dark Text Color
Step 1 :

To change Dark Text Color you have to open _variables.scss file and replace what color you want as shown in below

Rootpath : _variables.scss (assets/scss/_variables.scss )

Step 2 :

Note : After Changing color you must run gulp command i.e, gulp watch . Refer gulp page for more gulp commands click here.