Squarespace Favicon Size: What to Prepare and What to Confirm

The short answer

A Squarespace favicon, which Squarespace also calls a browser icon, is the small image shown in browser tabs, bookmarks and similar places. Prepare it as a square image built from a simplified version of your logo, with enough resolution that Squarespace can scale it down cleanly. The evidence for this article did not include Squarespace's current recommended pixel dimensions, accepted file types or file-size limit. Check those in Squarespace's own help documentation or the upload panel before you export.

What is being sized

The favicon is a separate asset from the site logo in your header. A header logo can be wide and detailed. A favicon is usually cropped to a square and shown at a tiny size, so the question is less about uploading a large file and more about whether the mark stays recognizable when it is very small.

Why the minimum legible size matters more than the upload size

Browsers commonly show favicons at only a few dozen pixels or fewer. At that scale, thin strokes, small text, taglines and fine detail blur or disappear. A high-resolution upload does not fix this, because the browser still shrinks the image to the same small display area. Legibility depends on the design of the mark, not on the pixel count of the file.

• Use a single symbol, monogram or initial rather than the full lockup with wordmark.
• Remove taglines and small text entirely.
• Thicken or simplify thin lines so they survive heavy reduction.
• Center the mark in a square canvas and leave a little padding so it is not clipped.
• Check contrast against both light and dark browser tab themes, because a transparent background inherits whatever surrounds it.
• Preview the exported file at actual tab size before uploading, not only zoomed in.

Vector artwork versus the file you upload

A vector master file is the right place to design and adjust the favicon, because it can be resized and simplified without quality loss. The supplied evidence did not confirm whether Squarespace accepts vector formats such as SVG for favicons. The dependable approach is to keep the vector as your editable source and export a square raster image, such as PNG, at the dimensions Squarespace currently recommends.

Do not assume a file contains editable vector paths because of its extension. A file saved as SVG, AI, EPS or PDF can still hold an embedded raster image or a flattened preview. Open it in a vector editor and confirm the shapes are selectable paths before you treat it as a scalable master. If the logo exists only as a low-resolution raster, the favicon will inherit that softness, and redrawing the mark as vector artwork is the cleaner fix.

A practical preparation workflow

• Look up Squarespace's current favicon dimensions, accepted file types and size limit in its official documentation.
• Open your vector logo master and confirm it contains real vector paths.
• Create a square artboard and place a simplified version of the mark inside it with modest padding.
• Export a raster file at the recommended dimensions in an accepted format.
• Upload it in your site's browser icon setting and check it in a live browser tab.

Gaps in the available evidence

This article does not state Squarespace's exact recommended dimensions, accepted formats, file-size limit or the menu path to the favicon setting, because none of these were confirmed in the supplied evidence. Squarespace may also change them between platform versions. Treat the official specifications as the authority on numbers, and use the guidance above for preparing artwork that reads clearly at small sizes.

If the logo belongs to someone else, such as a client or a brand whose mark you downloaded, having a copy of the file does not grant permission to modify the artwork, use its fonts or apply the trademark. Confirm those rights before you create a derived favicon.