Logo and favicon

Configure Strata logos, favicon, and responsive logo widths.

Use Logo and favicon to add your storefront logo, provide an optional contrasting logo for transparent headers, set the browser tab icon, and control the logo width on desktop and mobile.

Open Logo and favicon

From Shopify admin, go to Online Store > Themes.
Find Strata and select Customize.
Select Theme settings in the left toolbar.
Open Logo and favicon.

The Logo and favicon settings in the Strata Theme Editor.

Logo

Logo sets the main logo used by the storefront header.

Select the image field under Logo.
Choose an existing image or upload a new one.
Select the image to apply it to the preview.

Use a clear logo that remains readable at the smaller mobile width. Check it against every non-transparent header background used by the store.

Transparent header logo is optional. Use it when the main logo does not have enough contrast over the media behind a transparent header.

Choose a contrasting version with the same dimensions as the main logo. Keeping both files the same size prevents the header from shifting when its background changes.

Favicon

Favicon sets the small icon shown in browser tabs and bookmarks.

Select the image field under Favicon.
Choose or upload a square image.
Keep the artwork simple and high contrast so it remains recognisable when small.

Shopify displays the uploaded favicon at 32 × 32 px.

Logo width

Use the two width controls to size the same logo independently for each screen size:

Logo width (desktop): 80–240 px. The default is 96 px.
Logo width (mobile): 60–180 px. The default is 78 px.

Adjust the sliders while watching the preview. On mobile, leave enough room for navigation, search, account, and cart controls.

Review before publishing

Preview the header on desktop and mobile.
Check both opaque and transparent header backgrounds used by the store.
Confirm the transparent logo has the same dimensions as the main logo.
Open the storefront in a browser tab to review the favicon at its real display size.
Save the theme only after the logo, header controls, and favicon remain clear in every state you use.