Theme Element Color References for the Administration Portal¶
Note
Color selection on the Branding tab of a theme always affects the Admin and Business Admin Portal.
Color selection on the Branding tab of a theme only affects the Legacy Admin Portal if no theme file is attached to the theme.
To edit and manage theme files:
Refer to Less files and Theme Customization
Color selection is optional: where no colors are selected, defaults apply.
Administration Portal Default Colors¶
Default Color Reference Table:
Title |
Field Name |
Default Value (Hex) |
Notes |
---|---|---|---|
Primary Colour |
primary_colour |
#000046 |
This is the background colour for most menus and headers, as well as the text colour for links and buttons. |
Primary Text Colour |
primary_text_colour |
#ffffff |
This is the text colour for anything with the primary colour background. |
Accent Colour |
accent_colour |
#007fb0 |
This colour is used when attention needs to be drawn for important notifications or active buttons and text. |
Accent Text Colour |
accent_text_colour |
#ffffff |
This is the text colour for anything with the accent colour background. |
Background Colour |
background_colour |
#e6e7e8 |
The colour of the background. |
Topbar Colour |
topbar_colour |
#000046 |
The colour used for the top bar of the site. Will use the primary colour if no value is given. |
Topbar Text Colour |
topbar_text_colour |
#ffffff |
This is the text colour for the top bar. Will use the primary text colour if no value is given. |
Menu Colour |
menu_colour |
#000046 |
The colour used for the menu on the left. Will use the primary colour if no value is given. |
Menu Text Colour |
menu_text_colour |
#ffffff |
This is the text colour for the menu. Will use the primary text colour if no value is given. |
Panel Colour |
panel_colour |
#ffffff |
The colour used for all the panels in the app. |
Panel Text Colour |
panel_text_colour |
#414042 |
This is the text colour for normal text in the app. |
Info Notification Colour |
info_notification_colour |
#00ade5 |
The colour used for info notifications. |
Info Notification Text Colour |
info_notification_text_colour |
#ffffff |
This is the text colour for info notifications. |
Error Notification Colour |
error_notification_colour |
#dc0c00 |
The colour used for error notifications. |
Error Notification Text Colour |
error_notification_text_colour |
#ffffff |
This is the text colour for error notifications. |
Success Notification Colour |
success_notification_colour |
#68bd17 |
The colour used for success notifications. |
Success Notification Text Colour |
success_notification_text_colour |
#ffffff |
This is the text colour for success notifications. |
Warning Notification Colour |
warn_notification_colour |
#fbc403 |
The colour used for warning notifications. |
Warning Notification Text Colour |
warn_notification_text_colour |
#000000 |
This is the text colour for warning notifications. |
On the Admin Portal, consider the color selection on the Branding tab:
Note
If a color value appears blank, default values apply.
Sub-menu and sub-sub-menu backgrounds are rendered as percentages of the Menu Colour.