Using Colour theme in Website Builder

With "Colour theme" in Website Builder, you can set a complementary colour scheme for your website and ensure that the same colours are used consistently across all pages.

It will also automatically change the colour of a button component, for example, to match the background colour of the box, strip, or section in which it is placed. You can always turn off colour theming if you prefer to set your colours manually.

Note: Enabling "Colour theme" in an existing site will change all colours in your site to the palette you select. Disabling it will revert everything back to how it was before.

Enable Colour theme

Colour theme is enabled by default when you create a new website and is based on the template you select to begin with. You only need to activate it if you have an older website or if you deactivated it at some point.

  1. Click the Colour theme button in the bottom-right corner.
  2. Click on the slider on the top-left side of your workspace to enable it.
  3. Click through the onboarding screens and finally click Apply colour theme.

Colour-theme-icon.png

Edit a Colour theme

You can edit each of the four colours from your colour theme individually. We recommend first deciding on the primary colour for elements such as background and buttons. This will help you find colours for accents and texts that complement your main colour.

  1. Click the Colour theme button in the bottom-right corner.
  2. Click the pencil icon next to the active colour palette.
  3. Click on the colour you want to change, for example, the main colour.
  4. Select one of the recommended main colours or find a colour you like in the colour picker.
  5. Click Save at the bottom of the screen to save your changes.

Colour-theme-edit.png

Disable Colour theme

If you prefer to select colours manually, you can easily turn off colour theming. If you manually activate "Colour theme", deactivating it will revert all colours to their original state.

  1. Click the Colour theme button in the bottom-right corner.
  2. Click on the slider on the top-left side of your workspace to disable it.
  3. Select Yes, switch off in the pop-up window to confirm.
  4. Click Save and Publish to make your changes visible online.

Colour-theme-disable.png

Related articles:

Was this article helpful?

Can’t find what you are looking for?

We're here for you.

Chat with us - every day of the year

are answered as soon as possible

Phone us on weekdays from 10am to 2pm (UTC)
+44 20 8106 0910