{"id":5288,"date":"2025-01-14T10:17:02","date_gmt":"2025-01-14T10:17:02","guid":{"rendered":"https:\/\/www.names.co.uk\/support\/?post_type=ht_kb&p=5288"},"modified":"2025-01-14T10:17:03","modified_gmt":"2025-01-14T10:17:03","slug":"how-to-change-the-complementary-colour-of-your-website","status":"publish","type":"ht_kb","link":"https:\/\/www.names.co.uk\/support\/articles\/how-to-change-the-complementary-colour-of-your-website\/","title":{"rendered":"How to Change the Complementary Colour of Your Website"},"content":{"rendered":"\n

Your site features an extra colour that appears in the logo, icons, buttons, underlined links, headings in the price list, and product names in your online store. This additional colour is part of the template you chose to ensure a cohesive design. If you\u2019d like to change this colour, please follow the steps below.<\/p>\n\n\n\n

Getting Started<\/h2>\n\n\n\n

To get started, you first need to log into the web builder through your Online Control Panel. Unsure how to do so? Follow our guide HERE<\/a><\/p>\n\n\n\n

Step One<\/h2>\n\n\n\n

Go to Settings<\/strong>. <\/p>\n\n\n\n

<\/div>\n\n\n\n
\"\"<\/figure>\n\n\n\n
<\/div>\n\n\n\n

Step Two<\/h2>\n\n\n\n

Select Design<\/strong> in the left column, then go to Change Colours<\/strong>.  <\/p>\n\n\n\n

<\/div>\n\n\n\n
\"\"<\/figure>\n\n\n\n
<\/div>\n\n\n\n

A window for changing the complementary colour of your website will appear. <\/p>\n\n\n\n

<\/div>\n\n\n\n

IMPORTANT:<\/strong> Web content editing is not accessible in this window. You can return to editing by clicking the X<\/strong> or selecting Save changes<\/strong> in the upper right corner.\u00a0<\/p><\/div>\n\n\n\n

<\/div>\n\n\n\n
\"\"<\/figure>\n\n\n\n
<\/div>\n\n\n\n

Step Three<\/h2>\n\n\n\n

In the upper right corner, you\u2019ll find the Advanced Settings<\/strong>, allowing you to choose which elements will be impacted by the change in complementary colour. If you leave the toggle off for a specific element, it will remain in the base colour. <\/p>\n\n\n\n

<\/div>\n\n\n\n
\"\"<\/figure>\n\n\n\n
<\/div>\n\n\n\n

Step Four<\/h2>\n\n\n\n

You can expand the colour menu located by the Complementary Colour<\/strong> box.  The colour change will apply to all elements designated as complementary on your website and marked as active in the Advanced Settings. If you select the first colour from the second row (default from the left), the pages will not display any complementary colour. <\/p>\n\n\n\n

<\/div>\n\n\n\n
\"\"<\/figure>\n\n\n\n
<\/div>\n\n\n\n

Step Five<\/h2>\n\n\n\n

You need to save your selection of the complementary colour in the upper right corner. Alternatively, you can close the complementary colour window without saving changes by clicking the X<\/strong> located by Save changes<\/strong>. <\/p>\n\n\n\n

<\/div>\n\n\n\n
\"\"<\/figure>\n\n\n\n
<\/div>\n\n\n\n

TIP<\/strong>: For regular text, you can change the colour directly in the editing field. If you modify the colour of a heading or subtitle in the text field, the complementary colour change won\u2019t apply to those texts; you\u2019ll need to update the colour manually again.\u00a0<\/p><\/div>\n\n\n\n

<\/div>\n\n\n\n
\"\"<\/figure>\n\n\n\n
<\/div>\n\n\n\n

If you have any further questions, simply raise a support request<\/a><\/strong> from within your Online Control Panel or call us on 0345 363 3634<\/strong>. Our Support team are here to help and ready to assist you with your enquiry.<\/p>\n\n\n\n

For assistance raising a support request please follow the following guide<\/a>.<\/strong><\/p>\n\n\n\n

<\/div>\n\n\n\n
\n
Explore Website Builder<\/a><\/div>\n<\/div>\n\n\n\n
<\/div>\n\n\n\n
Can I customise specific sections of my website differently?<\/summary>\n

Website builders offer flexible customisation options for individual sections<\/a> whilst maintaining overall design coherence.<\/p>\n\n\n\n