Advanced Website: Theme Colors

Automatically Configure Global Colors

The automatic theme colors generator scans your site and detects the most frequently used colors. It generates a list of colors to select from, and once selected, those colors become your theme colors and are connected to your site widgets.

1. On your Dashboard, click Create New Site.
2. Select a template and click Start Building. The following templates have the ability to auto-generate theme colors: SEO Consultant Landing Page, Real Estate Agency, Insurance Company, Roofing Company, Plumber, Blank Real Estate Agency, Professional CV, Gardener, and Accountant.
3. In the side panel, click Theme, then click Colors.
4. Click Start connecting colors.
5. Click Connect it for me or I'll connect it myself.
6. (Optional) If you selected I'll connect it myself, click the Plus icon next to each color in the design panel and select the colors individually.
7. Select which of the generated colors you want to use.
8. Click Save & Connect Colors.

The colors will populate in the Colors section of the Site Theme panel.

Connect Global Colors to Widgets

To connect a widget to a theme color:

1. Click a widget to open its settings menu.
2. Open the color settings and select one of the theme colors listed at the top.
3. Repeat as necessary for other elements.
4. (Optional) If you need to edit one of the theme colors, click the pencil icon and the theme colors settings will open where you can edit the desired color.

Once a widget is connected to theme colors it will automatically update when the linked theme color is updated.

Remove Theme Colors

You can disconnect any widgets connected to individual theme colors.

To remove individual theme colors: 

1. In the side panel, click Theme.
2. Click Colors.
3. Click the three horizontal dots icon next to the Colors text and select Remove theme colors.
4. Select which colors to remove, then click Remove Selected Colors.

Permissions