Shopify handles favicon setup through its theme editor rather than requiring manual code changes, making it one of the more straightforward e-commerce platforms to configure — provided you know where to find the setting.
Setting a favicon in Shopify
- From your Shopify admin, go to Online Store > Themes
- Click Customize on your active theme
- Look for Theme Settings (usually at the bottom of the left-hand panel), then a section labeled Favicon or similar (exact wording varies slightly by theme)
- Upload a square image — Shopify typically recommends a minimum size such as 32x32 pixels, though uploading a larger square image (512x512 or so) generally produces better results across contexts
- Save the theme changes
What Shopify generates from your upload
Shopify's built-in favicon handling generates the core browser tab favicon automatically from your single upload. Depending on your specific theme, more complete coverage (Apple touch icon, Android/PWA manifest icons per our dedicated guide) may or may not be automatically included — this varies more by theme than it does with WordPress's more standardized core feature.
Uploading a higher-resolution source image
Even though Shopify may only request a minimum size like 32x32, uploading a larger, high-resolution square image (see our high-DPI guide) as your source generally produces a sharper result once Shopify generates its various derived sizes internally, compared to uploading only the bare minimum size.
Adding a more complete favicon set for advanced needs
For store owners wanting full control over every favicon size and format — including a proper .ico fallback or complete PWA manifest icons — Shopify's theme code (accessible via Online Store > Themes > Edit code) allows adding custom HTML link tags directly into the theme's layout file, typically theme.liquid, inside the <head> section. This is a more advanced approach than the standard theme settings upload, and it's worth being cautious editing theme code directly, ideally after duplicating your theme as a backup first.
Favicon design considerations specific to e-commerce
For a store, the favicon often serves as a quick visual identifier in a customer's browser history or open tabs, particularly relevant if a customer is comparison shopping across multiple open store tabs simultaneously — see our related guide on favicon best practices for e-commerce sites for more on this specific context.
A caching note specific to Shopify
As with any platform, an updated favicon may not appear immediately due to browser caching — see our general guide on favicon caching issues for how to force a refresh and confirm the update actually took effect.
Generate your files first
Before uploading through Shopify's theme settings, use our free Favicon Generator to create a clean, properly-sized square source image — a good starting point regardless of which specific Shopify theme you're using.
Keep reading: