Logo and favicon

Upload your logo, a transparent (light) logo variant, and a favicon.

Logo and favicon setting panel

---

Logo

Your primary logo, shown in the header on every page.

Logo displayed in the header — standard background vs transparent overlay mode

• Use a PNG or SVG with a transparent background so it looks clean on any color scheme.

• Upload at 2× the display size for sharpness on high-density screens (e.g. 320px for a 160px logo).

• Set the display width in Header settings.

---

Transparent Logo

A light-colored version of your logo, shown where a dark logo would be hard to read — over dark headers, menus, or footers. Upload a white or light PNG/SVG with a transparent background.

Transparent logo switching — standard header vs transparent overlay mode

Where it's used

• Transparent header overlay (automatic) — When a page's first section uses the transparent header, Helix shows the transparent logo, then restores the primary logo once the sticky header appears.

• Mobile menu drawer (manual) — Set the mobile menu's Logo style to Transparent.

• Footer (manual) — Set the footer Logo block's Logo style to Transparent.

• Password page (manual) — Set the password page header's Logo type to Transparent.

If the Transparent Logo is left empty, Helix falls back to your primary logo in every context — nothing breaks if you skip it.

---

Favicon

The small icon shown in the browser tab and bookmarks.

Favicon displayed in browser tab and bookmarks

File requirements: Use a square image of at least 32×32px in .png or .ico format. Avoid transparent backgrounds — they can render as black in some browsers. After saving, a hard refresh (Ctrl+Shift+R / Cmd+Shift+R) may be needed before the new favicon appears.

---

Need help?

Whether you have a question, run into an issue, or just need some guidance, our support team is here to help.

Chat with us Submit a ticket