Airsquare uses the RGB (red, green, and blue) colour system which is more versatile for a fluid mobile friendly design and allows you to apply transparency to your colours.
Common best practice for web design is to limit your website to only 3-4 colours. and use different shades of those colours. The website 0to255.com is great for getting a range of different shades and tones.
If you have uploaded your logo to Airsquare then we will have automatically added some of your logo's colours into the colour palettes for you to choose from, otherwise you will have a range of default colours.
How do I edit a colour?
When you change your colours, the new colours will immediately be displayed in the website preview on the right-hand side of your screen.
Go to Website > Settings > Colour.
Find the section you are looking for and click the small triangle to the right of the heading to expand the section.
Find the colour that you would like to edit and click on it to open a colour palate.
You can choose from the range of colours on the left hand side of the palate (colours that you've recently used) or you can click and drag on the little circle in the big gradient square to alter the colour or enter the RGB code of the colour you want to use.
Click the Choose button.
Click the Update button.
How do I remove a colour?
Go to Website > Settings > Colour.
Find the section you are looking for and click the small triangle to the right of the headings to expand the section.
Find the colour that you would like to remove and click on it to open a colour palate.
Click the X button in the top right of the colour palate.
Click the Choose button.
Click the Update button.
What do some of the sections contain both a Background (primary) and a Background (secondary)?
Having a primary and a secondary background colour means that you can create backgrounds with the two colours transitioning into each other. For example, if you set a background's primary colour to red and the secondary colour to yellow, then your background would have a transition from red to orange to yellow.
How do I create a colour transition for a background?
As well as the primary and the secondary colour you will also need a Background gradient angle from 0° to 360° to define the direction of the colour transition.
Go to Website > Settings > Colour.
Find the section you are looking for and click the small triangle to the right of the headings to expand the section.
Click the Background (primary).
Select a colour and click the Choose button.
Click the corresponding Background (secondary).
Select a colour and click the Choose button.
Enter a Background gradient angle.
Click the Update button.
Using the Background gradient angle can initially be confusing so the following is intended to provide some guidance on which angle will create the transition you want:
An angle of 90° creates a transition from the Primary colour to the Secondary colour from the left to the right.
An angle of 180° creates a transition from the Primary colour to the Secondary colour from the top to the bottom.
An angle of 270° creates a transition from the Primary colour to the Secondary colour from the right to the left.
An angle of 360° creates a transition from the Primary colour to the Secondary colour from the bottom to the top.
If you want to create a diagonal transition then use an angle between one of the angles above. For example, if you wanted a transition from the Primary colour to the Secondary colour that started in the top left and finished in the bottom right, you could enter a Background gradient angle of 135°.
What if I want a background with a solid colour?
If you would prefer a solid background colour just ensure that the Primary colour and the Secondary colour are both set to the same colour.
How do I apply transparency to a colour?
Go to Website > Settings > Colour.
Find the section you are looking for and click the small triangle to the right of the headings to expand the section.
Click the colour that you would like to change to open a colour selection palate.
Drag the slider under the big gradient square left for more transparency or right for less transparency.
Click the Choose button.
Click the Update button.