Breadcrumbs

Set Theme Colors


Administrators can set theme colors for backgrounds, cards, buttons, and many more on Community Hub from Community Hub Settings.

  1. In the tab bar, click  applauncher.png App Launcher. 

  2. Search and select Community Hub Settings. 

  3. Go to the Theme Settings custom setting.

  4. Click Edit next to Theme.

  5. In the required fields, enter the color values in the hex form.

  6. Click Save.


Ensure Theme Enabled is selected. 


Each field on Theme Settings is responsible for setting the theme color for a specific entity.

Here is the list of fields that need to be populated with color values and their respective functions.


Field Name

Function

Additional Information

Card Background Color

It sets the background color to display on the cards. 


Card Color

It sets the foreground color to display on the cards. 


Card Heading Color

It sets the color of all the card headings. 


Default Active Button Background Color

It sets the default background color of the active buttons. 


It includes pagination and filter buttons but not the primary and secondary buttons. 

Default Active Button Foreground Color

It sets the default foreground color of the active buttons. 

Default Button Background Color

It sets the default background color of the buttons. 

Default Button Foreground Color

It sets the default foreground color of the buttons. 

Disabled Button Background Color

It sets the background color of the disabled buttons. 


Disabled Button Color

It sets the foreground color of the disabled buttons. 


Footer Background Color

It sets the background color of the footer. 


Footer Color

It sets the foreground color of the footer. 


Header Background Color

It sets the background color of the header. 


Header Color

It sets the foreground color of the header. 


Link Color

It sets the foreground color of the links.


Link Hover Color

It sets the foreground color of the links when hovered. 


Off Canvas Background Color

It sets the background color of all the off-canvas items. 


It is only seen on phone-sized mobile devices. 

Off Canvas Color

It sets the foreground color of all the off-canvas items. 

Off Canvas Nav Separator Color

It sets the background color of the visual separator between the off-canvas navigational items. 

Page Heading Background Color

It sets the background color of the page heading section. 


Page Heading Color

It sets the foreground color of the page heading section. 


Primary Background Color

It sets the background color of the page. 


Primary Button Background Color

It sets the background color of the primary buttons.


Primary Button Color

It sets the foreground color of the primary buttons.


Primary Text Color

It sets the foreground color of the text on the page. 


Secondary Button Background Color

It sets the background color of the secondary buttons.


Secondary Button Color

It sets the foreground color of the secondary buttons.


Zebra Stripe Background Color

It sets the background color of alternate row zebra stripes.