📌 We recommend to use Google Chrome to ensure an optimal experience when using AppicalNow.
Overview
After creating a course, you may want to customise it to reflect your brand’s unique style. Adding colours and adjusting fonts can make the course visually engaging and aligned with your corporate identity.
Styling your course enhances brand consistency, ensures a professional look, and improves user engagement. Custom colours, fonts, and mobile styling create a seamless experience for users across all platforms.
Steps to style your course
→ Accessing Course Styling
Navigate to 'Courses' in the main menu. Locate the course you want to customise, click the hamburger icon on the top left, and select 'Styling'.
→ Adding Brand Font & Colours
In the course styling section, you’ll find fields for your corporate font and colour codes.
Choosing Fonts
Select a font that aligns with your brand style. This will help maintain consistency across your branding materials and enhance readability.
Choosing Text Colours
Use HEX Colour Codes to apply your brand colours. These colour codes can contain all values between # 000000 and #FFFFFF.
Note: If you only know the RGB values, you can easily convert them online on this website: RGB to HEX.
→ Selecting key colours for the platform
Main Colour
This is the primary colour, it will be the most visible colour, used for the biggest and most significant page elements in the platform. Choose your brand’s main colour for the most consistent look. Elements with this colour: navigation bar, start button and navigation buttons.
Background Colour
Is automatically adjusted based on your main colour selection and cannot be manually changed.
Support Colour
This secondary colour appears on smaller elements like buttons and icons, enhancing user interaction. Elements with this colour: first day countdown, story, chapter and page progress.
Support Colour for Text
Used to highlight important text. Make sure it’s visible against a white background to improve readability. Elements with this colour: Text with link and progress bar in dashboard.
Status Bar Android (Android Only)
Customise the Android Status Bar colour to align with your brand’s primary colour scheme.
Default Colour
Used to make the user experience easier to navigate. This colour cannot be changed. Elements with this colour: green appears when a course is completed to show success.
Let us know if this article answered your question by using the buttons below. If not, get in touch with our Support Channel for more information: