Specs by builder
Builders document favicons unevenly. Framer gives an exact size, Shopify gives a target and a resize rule, and Carrd documents the steps and plan but not dimensions.
| Builder | Where to set it | Plan rule | Size and format guidance |
|---|---|---|---|
| Carrd | Publish, Media tab, Icon; crop on upload | Pro Lite or higher ($9 a year for 3 sites) [1][2] | No size or format stated; upload a square image |
| Framer | Site Settings, General, Favicon; separate light and dark icons | No plan rule stated in the help article [4] | 64 x 64 PNG recommended; Safari does not display SVG favicons [4][5] |
| Shopify | Theme settings, Logo or Favicon (depends on theme version) | Basic or higher; not on Starter [6] | 16 x 16 or 32 x 32 ideal; larger images reduced to 32 x 32 [6] |
Branding and plan tiers that affect the icon
Carrd lists Site Icons and No Branding on every Pro tier, including Pro Lite, but custom domains and forms start at Pro Standard ($19 a year). [2] Framer's Free plan shows a Made in Framer banner when published and needs an upgrade for a custom domain. [7][8] Shopify's favicon does not appear on checkout or customer account pages unless you are on Shopify Plus and use the Branding API or Checkout Blocks. [6]
Google Search favicon rules
Google requires a square (1:1) favicon of at least 8 x 8 pixels and recommends larger than 48 x 48. Supported formats are BMP, GIF, ICO, PNG, JPEG, PPM and TIFF. Declare it with a link rel icon tag in the home page head; Googlebot must be able to crawl the home page and Googlebot-Image the icon file. There is one favicon per hostname, the URL should be stable, and a favicon is not guaranteed to appear even when every rule is met. [3]
Google says crawling can take several days to several weeks. You can speed it up by requesting indexing of the home page with Search Console's URL Inspection tool. [3]
One-file export checklist
- Square artboard; at least 64 x 64 (Framer's recommended size, and above Google's 48 x 48)
- PNG with transparency; avoid SVG as the only file because Safari will not show it
- One bold shape or letter; test it at 16 x 16 before exporting
- Check contrast on both light and dark browser tabs; on Framer, upload a dark-mode version if needed
- Keep the same file name and URL after launch, as Google asks for a stable favicon URL
- For Shopify, expect the upload to be shrunk to 32 x 32, so check fine detail at that size
How to confirm it shows
Browsers cache favicons aggressively. Framer suggests refreshing, clearing the cache or opening a private window. [4] For Safari on a Mac, Framer's fix is to quit Safari, open the Favicon Cache folder in your Library's Safari folder, move its contents to the Trash and reopen Safari. [5] Shopify notes the favicon does not appear in the theme editor, so check the live storefront. [6]
| Where | How to check | Expected timing |
|---|---|---|
| Browser tab | Open the live domain in a private window | Immediately after publishing |
| Safari | Clear the favicon cache if an old icon persists | After cache clear |
| Phone home screen | Add the site to the home screen | After publishing |
| Google results | URL Inspection, request indexing of the home page | Several days to several weeks [3] |
Questions before you decide
What size should a favicon be?
Framer recommends a 64 x 64 PNG, Shopify says 16 x 16 or 32 x 32 is ideal and shrinks larger images to 32 x 32, and Google requires a square of at least 8 x 8 while recommending larger than 48 x 48.
Why is my favicon not showing in Google search results?
Google says crawling can take several days to several weeks, Googlebot must be able to crawl the home page and the icon file, and a favicon is not guaranteed to appear even when all guidelines are met.
Can I add a favicon on Carrd's cheapest paid plan?
Yes. Carrd's site icon feature requires Pro Lite or higher, and Carrd lists Site Icons and No Branding on Pro Lite, which is $9 a year for 3 sites.
Sources & verification
Product details and prices can change. Check the linked provider before buying.
- Carrd docs: adding a site icon Accessed 30 Oct 2026
- Carrd Pro plans Accessed 30 Oct 2026
- Google Search Central: define a favicon to show in search results Accessed 30 Oct 2026
- Framer Help: how to set up a favicon Accessed 30 Oct 2026
- Framer Help: why isn't Safari displaying the favicon? Accessed 30 Oct 2026
- Shopify Help Center: adding a favicon Accessed 30 Oct 2026
- Framer Help: best use cases for each Framer plan Accessed 30 Oct 2026
- Framer pricing Accessed 30 Oct 2026
Sources link directly to providers. Product buttons may use separately labeled affiliate links. Read our disclosure.