In this guide, you will learn how to change the complementary color of your website. Generally, your website uses a single complementary color, which appears in elements such as the logo, icons, buttons, link underlines, service price headings, or product titles in an e-shop. This complementary color is preset to match the chosen template and maintain a cohesive design. If you want to change this color, follow these steps:
1. Open Settings in the top left corner.
2. In the left column, select Design, then go to Change colors in the Website colors row.
3. The environment for changing your website’s complementary color will open.
WARNING: In this environment, you cannot edit website content. You can return to editing by clicking the cross or by saving changes in the top right corner.
4. In the top left under Complementary color, you can expand the color palette. Changing the color will affect all elements using the accent color that are activated in Advanced Settings (see below). If you select the first color option from the left in Default template colors (crossed-out white box), the website will have no accent color.
5. In the top right corner, you will find Advanced settings, where you can select which elements the complementary color change will apply to. If a button for a given element is left off, the element will remain in the default color.
You will also find the Color palette option, which colors elements on your page for which no accent color is set.
For regular text, the color can be changed directly in the text field editor. If you have changed the color of a heading, subheading, or title directly in the text field, the complementary color change will not affect these texts, and you will need to adjust the color manually.
