What Size Should Squarespace Product Images Be?

Short answer

Squarespace does not require one fixed product-image dimension. Export a clean RGB/sRGB master at roughly 2500px wide, keep each upload under 5MB, and aim for 500KB or less when image quality allows. Squarespace creates responsive versions automatically, so you do not need to export a special 750 × 500px file. Images below 1500px wide can look blurry on large screens. Squarespace’s image-formatting guidance documents these limits and responsive widths.

Recommended Squarespace product-image settings

Setting	Recommendation	Why
Source width	About 2500px	Leaves enough pixels for Squarespace’s largest responsive variant.
Minimum practical width	1500px or more	Smaller files may soften on large displays.
File size	Below 5MB; target 500KB or less	5MB is the product-image limit; smaller files generally load faster.
Formats	JPG, PNG, GIF or WebP	Squarespace normally delivers site images as WebP. Animated WebP is not supported.
Color profile	RGB or sRGB	Provides predictable browser and mobile color. CMYK is intended for print.
Responsive widths	100, 300, 500, 750, 1000, 1500 and 2500px	Squarespace selects a suitable version for the visitor’s viewport.

These are working targets rather than a required canvas size. Squarespace resizes images to fit different device widths automatically.

Why 2500px is the useful target

A 2500px-wide master gives Squarespace enough source detail to generate its full responsive range. Uploading a 1000px image can be adequate for a small card, but the same source may be enlarged on a desktop product page and appear soft. Uploading a much larger file only increases processing and transfer work; it does not create a visible benefit after Squarespace’s responsive processing.

Keep the original high-quality file in your own storage. Squarespace recommends retaining originals after upload so you can re-export, crop or compress them later.

Choose an aspect ratio that fits your store

Squarespace does not publish one universal “best” product ratio. Common choices include 1:1 (square), 4:5 (slightly portrait) and 2:3 (portrait). Select the ratio that matches the product, the available screen space and the crop behavior of your template.

• Use a consistent ratio for catalog grids. A uniform ratio keeps cards aligned and makes a collection easier to scan.
• Leave safe space around the item. Template settings can crop an image to fill its container. Keep important edges, handles and labels away from the trim area.
• Use detail views when texture matters. Product-detail pages and quick-view lightboxes can let customers zoom instead of forcing every catalog thumbnail to be extremely large.
• Preview both grid and detail pages. The same source can look correct in a product grid but crop awkwardly in the product gallery.

Set the product-image aspect ratio in your store-page and product-detail-page settings, then review representative products at desktop and mobile widths.

Featured, additional and variant images

The first image, or the image you explicitly select as featured, appears first in store grids, product blocks, summary blocks and product-detail pages. Make it the clearest view of the item.

• Featured image: a straightforward hero view that remains recognizable at thumbnail size.
• Additional images: alternate angles, close-ups, dimensions, texture and an in-use or staged view.
• Variant images: photos tied to a color, size or other option so shoppers can see the selected version.

Squarespace allows up to 100 images per product, but an image-heavy product page can load slowly. Keep the page under 5MB where practical and remove redundant views.

A preparation workflow that works

1. Export a master. Use your editor’s sRGB/RGB setting and export at about 2500px wide. Preserve the original separately.
2. Compose for the crop. Center the item consistently, leave edge padding and avoid placing critical details near the crop boundary.
3. Compress deliberately. Export JPG for photographic products, PNG when transparency or sharp graphics require it, or WebP when your workflow supports it. Keep the file below 5MB and try for 500KB or less without visible artifacts.
4. Upload and preview. Check the product grid, product detail page, quick view, zoom and mobile layouts.
5. Check color and sharpness. Compare the uploaded result with your local file on an actual phone and desktop display.
6. Keep a source archive. Store the original and a record of the crop, ratio and export quality used.

Diagnose blurry or slow product photos

Symptom	Likely cause	Fix
Blurred on desktop	Source is below about 1500px wide or has been enlarged.	Re-export a sharper master near 2500px wide.
Important parts are cut off	Template crop or focal-point mismatch.	Leave more safe space, change the aspect ratio setting or recrop the source.
Product grid looks uneven	Mixed aspect ratios or inconsistent composition.	Standardize the ratio and camera framing across the catalog.
Page loads slowly	Many large files or too many redundant images.	Compress toward 500KB, remove duplicates and keep the product page under 5MB.
Colors look dull or strange	CMYK or an embedded profile the browser handles differently.	Convert and export in RGB/sRGB.
Upload rejected	File exceeds the 5MB product-image limit or uses an unsupported format.	Compress below 5MB and use JPG, PNG, GIF or non-animated WebP.
Animation does not play	Animated WebP is not supported.	Use a supported format or a static product image.

Performance and cost considerations

Squarespace’s responsive variants reduce the amount sent to small screens, but the source you upload still affects processing and storage. A 2500px file compressed to a sensible quality level is a practical balance between zoom detail and transfer size. The 500KB target is a performance guideline, not a quality requirement; keep more data when fine texture or accurate edges are essential.

Do not export every angle at maximum quality by default. Give the featured image and detail-critical views more attention, then use efficient exports for secondary thumbnails. Review the complete page weight, because 20 individually acceptable files can still create a slow product page.

Verify an image before uploading

You can check dimensions and file size locally with common tools. For example, ImageMagick reports both in one command:

magick identify -format '%f: %wx%h, %b\n' product.jpg

Look for a width near 2500px and a byte count below 5MB. If you use an image editor, its export dialog should show the same dimensions and color profile.

Or skip the browser setup

If you need screenshots of your finished product page for QA, approvals or documentation, ScreenshotNeo can capture the URL after handling common page distractions.

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp

import requests
r = requests.get("https://api.screenshotneo.com/v1/shot", params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"}, timeout=90)
open("shot.webp", "wb").write(r.content)

const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);

See the ScreenshotNeo API documentation for options. Cookie and consent banners, newsletter popups and chat widgets are removed before the shot; bot checks, blank pages and failed loads are never billed. Its MCP server lets AI agents take screenshots, and the free plan includes 1,000 screenshots a month with no card; paid plans start at $5 for 3,000.

Create a free ScreenshotNeo account.

FAQ

Do Squarespace product images have to be square?

No. Choose an aspect ratio that suits the product and your template. Square images are useful for consistent grids, while portrait ratios can show tall products better.

Is 750 × 500px the required size?

No. Squarespace resizes images automatically. A source around 2500px wide gives it the broadest responsive range.

What is the maximum product-image file size?

Keep each product image under 5MB. Squarespace also recommends keeping the overall product page under 5MB where practical.

Should I upload WebP?

WebP is accepted, and Squarespace normally converts site images to WebP for delivery. Animated WebP is not supported.

Why does my image look different in the product grid?

The grid may apply a crop or a different aspect-ratio setting. Adjust the store-page ratio, recrop with more safe space or use a more consistent source composition.