Squarespace Image Sizes — Banner, Gallery, Blog & Product Dimensions

Squarespace Banner Image Size

Upload a banner at 2500 pixels wide and make it wider than it is tall — 2500x1406 (16:9) is a safe default. That is as specific as Squarespace gets, and it is deliberate: page banners have no preset aspect ratio or dimensions because they stretch and change shape to fit whatever browser is looking at them. Banner height comes from your section settings and from the content overlaid on it, not from your image.

The consequence is that a banner always crops to some degree, especially on mobile, and how much depends on the banner height and the browser width. The more text you stack over a banner, the taller the section grows and the harder your image is cropped.

Resize an image to 2500x1406 → Pick the “Banner / Section Background” preset in the Squarespace platform.

Squarespace Blog Post Image Dimensions

A blog post’s image is its featured image — the same file Squarespace uses for the thumbnail in the blog feed, the header on the post itself, and the preview when someone shares the link. Because those three placements are different shapes, there is no pixel dimension that satisfies all of them, and Squarespace publishes none. Upload 1500x1000 (3:2) and set a focal point.

The thing that actually keeps a blog feed looking tidy is not the pixel count — it is using the same aspect ratio for every post. Images scale to fit the browser, but they always keep their shape, so a feed of consistent 3:2 images crops predictably while a feed mixing portrait and landscape never will.

Resize an image to 1500x1000 → Pick the “Blog Featured Image” preset in the Squarespace platform.

Squarespace Product Image Size for Online Stores

Squarespace Commerce inherits the same site-wide spec — no product-specific dimension is published. Upload square images at 2000x2000: comfortably above the 1500px blur floor, below the 2500px mobile ceiling, and square, which is the ratio that survives the grid on a shop page and the larger crop on the product page alike.

Two limits are worth knowing before you build a catalogue. A product can hold up to 100 images, but Squarespace warns that overloading one slows the page down — and asks you to keep pages under 5MB in total, a budget ten 500KB photos will exhaust on their own. Alt text is capped at 200 characters per image.

Resize a product photo to 2000x2000 → Pick the “Product Image” preset in the Squarespace platform.

Running the same catalogue on another storefront? Shopify recommends 2048x2048 and allows up to 5000x5000 — the recommended size drops into Squarespace unchanged, the maximum does not. See Shopify image sizes before you export a single set for both.

Squarespace Gallery Block Image Size

Gallery blocks and gallery sections crop to whatever grid, slideshow or carousel layout you pick, so — again — there is no fixed size. Upload at 1500x1500 or larger and spend your effort on ratio consistency instead: images with matching aspect ratios avoid both cropping and the blank space that shows up around mismatched ones.

Resize a gallery image to 1500x1500 → Pick the “Gallery Image” preset in the Squarespace platform.

Squarespace Logo & Favicon Size

The logo has no required dimension — Squarespace only advises starting with a larger image, since small ones pixelate when they resize, and preparing it at roughly the height you want it displayed. On version 7.0 the maximum display height is a template decision, ranging from 65 pixels on Bedford mobile up to 480 pixels on Five. A 1200x400 PNG with a transparent background covers every one of them at retina density. Beware the built-in image editor: editing a logo converts it to .jpg and the transparency is lost.

The favicon is the one asset with published numbers. Between 100x100 and 300x300 pixels, PNG (Squarespace does not accept .ico), and no larger than 100KB. It renders at 16x16 in the tab. If you care about the favicon Google shows in search results, note that Google separately wants a multiple of 48px square — 144x144 satisfies both rules at once.

Resize a favicon to 300x300 → Pick the “Favicon” preset in the Squarespace platform.