Adding a Company Logo
Your company’s logo appears at the top of the self-service portal and serves as a key branding element. To upload a logo:
Click on the “Upload logo” button.
Select a PNG file from your computer.
Ensure the image follows these recommended guidelines:
The maximum width is 300px, and the maximum height is 40px.
Use a logo with a white or transparent background for the best display.
Adding a Favicon
A favicon is a small icon that appears in browser tabs, bookmarks, and history. It helps users quickly identify the portal among multiple open tabs.
Click on “Upload fav icon” to add a favicon.
Select a PNG file from your device.
Use one of the supported sizes for the best resolution:
48×48px
96×96px
144×144px
Selecting Primary and Background Colors
This section allows you to modify the portal’s primary color (used for key interactive elements) and the background color.
Choosing a Primary Color
The primary color is applied to text buttons
Click on the input field
Enter a hex color code (e.g., #26A69F for teal).
Setting the Background Color
The background color sets the overall tone of the portal interface. By default, it is white (#ffffff), but you can customize it to match your brand. However, be cautious when choosing a very dark shade, as it may impact the visibility of text and other elements. After making changes, we recommend thoroughly reviewing the portal to ensure readability and usability remain optimal.
Customizing Headers and Body Text
To ensure brand consistency, you can modify both the header font and the body text font.
We support all Google Fonts out of the box, allowing you to seamlessly apply any font from the extensive Google Fonts library without the need for manual uploads or custom integrations
Configuring Headers
Headers are used for section titles and key messages. You can adjust the font style, weight, and color.
Select a Header Font from the dropdown menu.
Adjust the Font Weight (e.g., 600 for bold text).
Click the color box to choose a text color for headers.
Customizing Body Text
Body text appears throughout the portal, including instructions, descriptions, and informational content.
Upload a custom body font (optional).
Choose a Body Font from the available options.
Adjust the Font Weight (e.g., 300 for regular text).
Pick a text color to ensure readability.
📌 Custom fonts: We support custom fonts, but they require manual set-up. If you’d like to use a custom font, please contact our team for assistance. Before we can implement it, you must ensure that you have the proper licensing from the font’s foundry or provider. This means you must have explicit permission to use the font on a web-based platform, as some fonts are restricted to print use only or require extended licensing for digital applications.
Customizing Buttons and Interactive Elements
Interactive elements, such as buttons and checkboxes, can also be customized. You can modify their shape, colors, and text formatting.
Choosing a Button Style
You can select between two button styles to control their appearance:
• Rounded Corners → Creates buttons with soft, curved edges.
• Sharp Corners → Creates buttons with clean, squared edges.
Simply select the preferred option based on your brand’s aesthetic.
Changing Button Colors
The primary color for buttons, checkboxes
Click the color box next to Buttons and Progressbar color.
Enter a hex code.
Setting Button Text Color
Ensure button text contrasts well with the button background for readability.
Click the color box next to Button Text Color.
Enter a hex code (e.g., #ffffff for white text).
Enabling Uppercase Button Text
If you prefer button text to appear in all uppercase letters, check the box next to Text on buttons in all uppercase.
Adjusting Tile Background Colors
Tile backgrounds can also be changed to any color.
Configuring Page Alignment
Page alignment affects how content is positioned on pages in the portal.
• Left aligned → Aligns content to the left side.
• Center aligned → Aligns content in the middle for a balanced look.