Changing the logo, site icon and colors

Your site shows the logo in two places: the header at the top and the footer at the bottom. They are set separately. The small icon in the browser tab (favicon) is in the General settings.

Changing the header logo

1. Open the design editor with Websites → Manage → Design → Edit Design.
2. In Page Structure on the left, find Main Bar under Header. The first row is the site logo block (shown with your site’s name and “Left”). Click it, or click the logo in the preview.
3. The Site Logo & Title (Header) settings open on the right. Choose the Display mode: Image + Text, Image only or Text only. To use a logo image, choose Image only.
4. Under Logo images, click Upload next to Logo (light mode) and pick your logo from your computer, or choose an image you uploaded before from Library.
5. Optionally upload a second logo for Logo (dark mode, optional) (e.g. a white logo). It’s shown while the site is in the dark theme.
6. Check the logo in the preview, then click Save Draft and Publish at the top.

Logo size and fit

• Width (e.g. 220px) and Height (e.g. 48px): The size the logo is shown at.
• Max width (e.g. 280px) and Max height (e.g. 60px): The logo never exceeds these.
• Image fit: contain (fit keeping the ratio, recommended), cover (fill by cropping), fill (stretch to fill) or none (original size).

Text logo (no image)

In Image + Text or Text only mode, write the Title / Site name and Slogan / Subtitle under Text & Typography and choose the Font size (Small, Normal, Large).

Other logo settings

• Alignment within layer: Shows the logo on the left, center or right of the layer.
• Move to another layer: Moves the logo, e.g. from the Main Bar to the Nav Bar.
• Link & Target: Where clicking the logo goes (default “/” home page) and same/new tab.
• SEO & Semantic HTML: Marking the logo as the page’s <h1>, the HTML tag, Image alt text and Title tooltip text. Use your site’s name as the alt text.

Changing the footer logo

1. In the design editor, scroll the left panel down and open Footer.
2. Click the first block under Main Body (Logo, Menus & Contact) (shown with your site’s name, “Column 1”), or click the logo in the footer preview.
3. The Logo & About settings open on the right. Under Logo & intro settings, use Upload or Library for Logo (light mode) and Logo (dark mode, optional).
4. In the same section you can edit the intro text under the logo.
5. Save with Save Draft and Publish.

Site icon (favicon)

The small icon shown in browser tabs, bookmarks and on phone home screens. Change it in the site icon field on Websites → Manage → General with Change from library or Upload from device. It should be square and at least 512×512 pixels. See general site settings.

Site-wide colors and font

Click General Settings in the design editor’s top bar. The GENERAL SETTINGS panel opens on the left; these settings affect all pages:

• Colors: Your site’s main colors (links, highlights, badges).
• Typography: The font used on the site (e.g. Inter).
• Appearance: The overall style of cards and blocks (e.g. Card).
• Restore default settings: Resets the general settings.

Changes are previewed live; save with Save Draft and Publish to apply them to all pages. The colors of header layers (e.g. a red Main Bar) and individual blocks are changed in their own settings. See editing the header.