Grab Colour Schemes from Your Website

1. Brand your App to match your website.

Click "Get Colour Schemes" and enter your website URL. This will create a selection of custom colour palettes for you to choose from.


2. Click on the colour scheme sets created to preview the colours in the App.

You can change these colour schemes manually.


3. Manage the Basic colours in your App. 

Click inside each colour box on the right-hand toolbar and use the colour palette to choose the colour and shade. There are 4 default colour palettes you can choose from.

Alternatively, if you know the HEX colour codes for each colour, enter them into the box instead and you can manually choose colours for the options provided.

You can manage each element in your App, such as the Header Bar, Tab Bar, Tab Icons and Selected Tab Icons.


4. Manage the Advanced colours in your App. 

Switch the toggle to Advanced and edit each colour the same way.

These colours include Row, List Icon, Button Background and Text colours. Using the advanced colours option allows you to see all the changes that will be made as you go through each colour, allowing you to easily see which colours work best together on your app. As well as this, the advanced section gives you more options to individually customise such as the colour of the page background, as well as the colours for odd and even rows.


5. You'll also be given the option to edit your Header Bar Transparency.

For a completely solid, opaque header, it should be 'Off'. However, if you would like it to be transparent, you can select between 10% and 100% Transparency, with the higher the percentage meaning the more transparent.


6. Customise your app's font style.

Choose from our growing selection of fonts from the drop down menu to apply the new style across your app.

7. To check how your colour scheme and transparency settings look, click save and then preview your app.

Look out for the Red Dot in each section for more help!