Quick answer
From Shopify admin, open Online Store → Themes, find the theme you want to edit, click Edit theme, open Theme settings with the gear icon, and select Logo or Favicon. Choose a square favicon image, click Done, and save the theme.
How to Add or Change a Favicon in Shopify
Shopify adds a store favicon through the theme editor. Choose a small square image, open the settings for the published theme, select the favicon image, and save the theme.
Before You Start: Check Your Shopify Plan
Shopify favicon controls are available for online stores on the Basic plan or higher. Shopify Starter does not include the option to add a favicon to an online store.
| Shopify plan or surface | Favicon support |
|---|---|
| Starter | Not available for the online store |
| Basic or higher | Available for the storefront through Theme settings |
| Customer Accounts and Checkout | Shopify Plus only, with separate branding controls |
Step 1: Prepare a 32x32 Shopify Favicon
Shopify recommends a square favicon that is 16x16 or 32x32 pixels. Larger images are reduced to 32x32 when uploaded, so use simple artwork with strong contrast and no fine text.
A transparent PNG is a practical choice for most stores. Use our
favicon converter to
prepare an existing logo, or the
text favicon generator
to create an icon from a letter. If you downloaded a favicon.io
package, select favicon-32x32.png.
Step 2: Open the Shopify Theme Editor
From Shopify admin, go to Online Store → Themes. Find the theme where you want to add the favicon and click Edit theme.
Edit the theme that customers actually see. Updating an unpublished theme will not change the favicon on the live store until that theme is published.
Step 3: Open Theme Settings
Click the gear icon to open Theme settings. Depending on the theme version, the favicon control appears under either Logo or Favicon.
Step 4: Select the Favicon Image
In the Favicon image section, click Select image. Choose an existing image from Shopify or click Add images to upload the file from your computer. Select the image and click Done.
Some themes allow favicon alt text. If the option is available, click Edit, add a short description of the store icon, and save the image details.
Step 5: Save and Check the Live Store
Click Save in the theme editor. Open the public storefront in a new private window and check the browser tab. The favicon does not appear inside the Shopify theme editor because that preview is part of the Shopify administration interface.
Enter the public store URL in our favicon checker to verify that the live storefront exposes a reachable icon.
How to Change a Shopify Favicon
Return to the same Logo or Favicon section in Theme settings, select a replacement image, click Done, and save the theme. Check the published store in a private window because browsers often keep the previous favicon cached.
Shopify Checkout and Customer Account Favicons
The storefront favicon does not automatically appear on Shopify Customer Accounts or Checkout pages. Shopify limits favicon branding on those surfaces to Shopify Plus.
Plus merchants must configure the separate checkout branding through Shopify's Branding API or Checkout Blocks. The theme editor favicon setting alone does not update those pages.
Troubleshooting Shopify Favicons
- The favicon setting is missing: Confirm the store is on Basic or higher, then check both Logo and Favicon inside Theme settings.
- The favicon is missing in the theme editor: Check the live storefront instead. Shopify's editor is an administration page and does not show the storefront favicon.
- The old favicon still appears: Verify that you edited the published theme, then test in a private window or clear the browser favicon cache.
- The favicon looks blurry: Use simple square artwork designed for 32x32 pixels. Shopify reduces larger uploads to that size.
- The favicon is missing from Checkout: Checkout and Customer Accounts require Shopify Plus and separate branding configuration.
- Google shows no favicon or an old one: Verify the live storefront, submit the Shopify sitemap in Google Search Console, and wait for Google to crawl the store again. A search-result favicon is not guaranteed.
Shopify Favicon FAQ
What size should a Shopify favicon be?
Shopify recommends a square favicon that is 16x16 or 32x32 pixels. Shopify reduces larger uploads to 32x32, so design the icon to remain clear at that final size.
What format should a Shopify favicon use?
A transparent PNG is a reliable choice because it keeps clean edges on different browser-tab backgrounds. Keep the file square and preview it at 32x32 before uploading.
Can Shopify Starter stores add a favicon?
No. Shopify's online-store favicon control requires the Basic plan or higher. Starter stores do not have this setting.
Why does my Shopify favicon not show in Checkout?
Storefront favicon settings do not apply to Customer Accounts or Checkout. Those surfaces require Shopify Plus and separate configuration through the Branding API or Checkout Blocks.
Why is my Shopify favicon not updating?
Make sure you changed the published theme and clicked Save. Then open the live store in a private window to bypass the old favicon stored by the browser.
See Shopify's official favicon documentation for the current theme-editor and plan requirements.