Please follow the below steps to change Primary Color

Step 1 :

To change Primary Color you have to open custom-light-theme.css file and go through root replace what color you want as shown in below

Rootpath : custom-light-theme.css ( your-public-root-directory/whmcs/templates/hostma-hosting/custom/custom-light-theme.css )

Please follow the below steps to change Light Theme Color

Step 1 :

To change Theme Color you have to open custom-light-theme.css file and go through root replace what color you want as shown in below

Rootpath : custom-light-theme.css ( your-public-root-directory/whmcs/templates/hostma-hosting/custom/custom-light-theme.css )

Please follow the below steps to enable Dark Theme

Step 1 :

To enable Dark Theme you have to open head.tpl ( your-public-root-directory/whmcs/templates/hostma-hosting/includes/head.tpl ) file as shown in below

Step 2 :

Change the file name custom-light-theme.css to custom-dark-theme.css as shown in below

You want to change whole theme color like ( text color, border color, heading color, muted color, etc.. ) go through the screenshot

Please follow the below steps to change Dark Theme Color

Step 1 :

To change Theme Color you have to open custom-dark-theme file and go through root replace what color you want as shown in below

Rootpath : custom-dark-theme ( your-public-root-directory/whmcs/templates/hostma-hosting/custom/custom-dark-theme.css )

Step 1:

Go To custom-light-theme.css ( your-public-root-directory/whmcs/templates/hostma-hosting/custom/custom-light-theme.css )

if you want to change another font-family Go to the site Google Fonts And Select One font Family and import in to custom-light-theme.css file

How to Select font Family

Example:

Step 2:

And paste Your Selected font-family in custom-light-theme.css

Example:

Step 3:

And add the Your Selected font-family in ( your-public-root-directory/whmcs/templates/hostma-hosting/custom/custom-light-theme.css )

Example:

body {
	font-family: "Hind Siliguri", sans-serif; // Change the font family here
	font-size: 1rem;
	font-weight: 400;
	color: var(--default-color);
	background-color: rgb(var(--body-bg-rgb));
	line-height: 1.5;
	text-align: start;
	overflow-x: clip;
	padding: 0;
	margin: 0;
	min-height: 100vh;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}
		
	

Go to the path ( your-public-root-directory/whmcs/templates/hostma-hosting/custom/img/brand-logo/ ) folder and replace your logo with Previous Logos within in image size. note: Please don't increase logo sizes. Replace your logo within given image size. otherwise the logo will not fit in particular place it disturbs the template design.