Workflow6 min read·Updated

Ecommerce Image Size Guide (2026): Widths, Quality, WebP

You do not need a 4000 px square for a 400 px card. Use this size guide, convert the catalogue to WebP, and only then talk about apps and CDNs.

One master, many surfaces

Store one web master per SKU (about 1600–2048 px WebP). Let the theme create smaller srcset steps. Extra 4000 px 'zoom' files are rarely worth the LCP cost.

Why it matters

  • Themes request 2–5 widths per image.
  • A huge master makes every width expensive.
  • Feeds (Google Shopping) can use a separate JPEG if required.

How to do it

  1. Pick master width from the table below.
  2. Bulk convert the catalogue.
  3. Replace on the platform. Leave theme image settings at defaults.

Settings that work

If you only keep one file per SKU, choose 1600–2048 px / 80%.

SurfaceCSS width (typical)Master to uploadWebP quality
PLP card200–400 px800 px75–80%
PDP main600–800 px1600 px80%
PDP zoomviewport2048 px80–85%
Swatch32–64 px128 px85%
Home banner100vw1920 px75%
Convert a batch in your browser. Nothing is uploaded.

Put it into practice

Convert your images to WebP right now, free and privately in your browser.

Open the converter

Frequently asked questions

Yes on phones and most laptops. True print-quality zoom belongs in a download, not the PDP.

Match your theme. Size is about the long edge, not the aspect.

Keep reading

Workflow6 min read

Product photos to WebP

Studio JPEGs are too big for product pages. Bulk convert catalogue photos to WebP with widths that match your PDP and PLP.

Read more
Performance6 min read

Recommended image sizes

Practical max widths for heroes, content, thumbnails and retina — then convert those files to WebP.

Read more
Platforms6 min read

WebP for Shopify

Shopify now serves WebP automatically, but oversized originals still hurt LCP. How to convert product photos to WebP before upload, recommended sizes, and a private bulk workflow.

Read more