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.

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.

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.

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.

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.

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.

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.

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.

Please follow the below steps to change Transparent Body Color

Step 1 :

To change Transparent Body 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.

Please follow the below steps to enable Transparent Background Image Style1

Step 1 :

To enable Transparent Background Image you have to open custom.js file and remove comments for bg-img1 as shown in below

		// Bg-Image1 Style
		// $('body').addClass('bg-img1');
		// $('body').addClass('transparent-mode');
		// $('body').removeClass('light-mode');
		// $('body').removeClass('dark-mode');
												

Step 2 :

		// Bg-Image1 Style
		$('body').addClass('bg-img1');
		$('body').addClass('transparent-mode');
		$('body').removeClass('light-mode');
		$('body').removeClass('dark-mode');
												

Go To "assets/images/media" folder and replace your image with Previous image(bg-img1) within in image size.

Note: Please don't increase image size. Replace your image within given image size. otherwise the image will not fit in particular place it disturbs the template design.

Please follow the below steps to enable Transparent Background Image Style2

Step 1 :

To enable Transparent Background Image Style2 you have to open custom.js file and remove comments for bg-img2 as shown in below

		// Bg-Image2 Style
		// $('body').addClass('bg-img2');
		// $('body').addClass('transparent-mode');
		// $('body').removeClass('light-mode');
		// $('body').removeClass('dark-mode');
												

Step 2 :

		// Bg-Image2 Style
		$('body').addClass('bg-img2');
		$('body').addClass('transparent-mode');
		$('body').removeClass('light-mode');
		$('body').removeClass('dark-mode');
												

Go To "assets/images/media" folder and replace your image with Previous image(bg-img1) within in image size.

Note: Please don't increase image size. Replace your image within given image size. otherwise the image will not fit in particular place it disturbs the template design.

Please follow the below steps to enable Transparent Background Image Style3

Step 1 :

To enable Transparent Background Image Style3 you have to open custom.js file and remove comments for bg-img3 as shown in below

		// Bg-Image3 Style
		// $('body').addClass('bg-img3');
		// $('body').addClass('transparent-mode');
		// $('body').removeClass('light-mode');
		// $('body').removeClass('dark-mode');
												

Step 2 :

		// Bg-Image3 Style
		$('body').addClass('bg-img3');
		$('body').addClass('transparent-mode');
		$('body').removeClass('light-mode');
		$('body').removeClass('dark-mode');
												

Go To "assets/images/media" folder and replace your image with Previous image(bg-img1) within in image size.

Note: Please don't increase image size. Replace your image within given image size. otherwise the image will not fit in particular place it disturbs the template design.

Please follow the below steps to enable Transparent Background Image Style4

Step 1 :

To enable Transparent Background Image Style4 you have to open custom.js file and remove comments for bg-img4 as shown in below

		// Bg-Image4 Style
		// $('body').addClass('bg-img4');
		// $('body').addClass('transparent-mode');
		// $('body').removeClass('light-mode');
		// $('body').removeClass('dark-mode');
												

Step 2 :

		// Bg-Image4 Style
		$('body').addClass('bg-img4');
		$('body').addClass('transparent-mode');
		$('body').removeClass('light-mode');
		$('body').removeClass('dark-mode');
												

Go To "assets/images/media" folder and replace your image with Previous image(bg-img1) within in image size.

Note: Please don't increase image size. Replace your image within given image size. otherwise the image will not fit in particular place it disturbs the template design.