Squarespace

Add a favicon to your Squarespace website

How to Add a Favicon to Squarespace

Every Squarespace site should have a custom favicon instead of the default Squarespace icon. A favicon appears in browser tabs, bookmarks, and mobile home screens — it makes your site look professional and helps visitors identify your site at a glance. Squarespace makes this easy through the site settings.

Step 1: Prepare Your Favicon Image

Squarespace accepts PNG, JPG, and GIF formats. The recommended size is a square image of at least 100x100 pixels, but for the best results across all devices, use a 512x512 PNG. Squarespace only allows one image upload for your favicon, so use a large, high-quality source image and let Squarespace handle the resizing.

Create your favicon with our favicon generator or favicon converter. The android-chrome-512x512.png file from our generator works perfectly.

Step 2: Open Site Settings

Sign into your Squarespace account and open your site editor. In the left sidebar, click on the Design section, then click Browser Icon (also called favicon). On newer Squarespace versions, you may find this under Settings → General → Browser Icon (Favicon).

Step 3: Navigate to Browser Icon

In the Design section, click on Browser Icon in the navigation. This is where Squarespace manages your favicon.

Step 4: Upload Your Favicon

Click the upload area to select your favicon image from your computer. Squarespace may take a moment to process the image. Once uploaded, you'll see a preview. Squarespace includes a built-in editor that lets you adjust the colors and contrast if needed. When you're satisfied with the preview, click Save.

Step 5: Verify Your Favicon

Open your Squarespace site in an incognito window (Ctrl+Shift+N on Windows, Cmd+Shift+N on Mac) and check that the favicon appears in the browser tab. Using incognito bypasses your browser cache so you'll see the updated icon immediately.

Troubleshooting

  • Favicon not showing: Clear your browser cache and hard refresh (Ctrl+Shift+R on Windows, Cmd+Shift+R on Mac). Browsers aggressively cache favicons, so testing in an incognito window is the quickest way to see changes.
  • Favicon appears blurry: Your source image is likely too small. Upload an image that's at least 100x100 pixels. For the best quality, use a 512x512 PNG.
  • Old favicon still showing on mobile: Mobile browsers cache favicons separately and for longer periods. Clear your mobile browser data, or wait 24-48 hours for the cache to refresh.
  • Can't find the Browser Icon setting: Squarespace has moved this setting between versions. Try Design → Browser Icon first. If not there, check Settings → General or search "favicon" in the Squarespace help panel.

Squarespace Favicon FAQ

What size should a Squarespace favicon be?

Squarespace requires a minimum of 100x100 pixels, but recommends a square image. For the best results, upload a 512x512 PNG — Squarespace will automatically resize it for different contexts like browser tabs, bookmarks, and mobile home screens.

Can I upload multiple favicon sizes on Squarespace?

No. Squarespace only accepts a single favicon image. This is a limitation of the platform — you can't provide separate sizes for different devices like you can with custom HTML. That's why it's important to upload a high-resolution source image and let Squarespace handle the resizing.

What format should my Squarespace favicon be?

PNG is the best choice. It supports transparency (for logos on any background) and produces crisp results at small sizes. Squarespace also accepts JPG and GIF, but PNG gives the best quality.

Does changing my favicon affect SEO?

A favicon itself doesn't directly impact search rankings, but it does appear in Google's mobile search results next to your site name. A professional favicon improves brand recognition and can increase click-through rates from search results.