Shopify will accept almost any image you throw at it, which is exactly why so many stores end up with a patchwork of sizes and ratios. Here’s the cheat sheet worth pinning, followed by the reasoning — because knowing why a number matters is what lets you break it intelligently.
The cheat sheet
| Image | Recommended | Ratio | Notes |
|---|---|---|---|
| Product images | 2048 × 2048 px | 1:1 square | Enables full zoom; keeps grids aligned |
| Collection images | 2048 × 2048 px | 1:1 square | Match your product ratio |
| Slideshow / hero banner | ~2000–2500 px wide | Theme-dependent | Check your theme’s docs; wide beats tall |
| Logo | 2× its displayed width | — | PNG with transparency (or SVG) |
| Favicon | 32 × 32 px minimum | 1:1 | Simple marks survive the shrink |
| Social share (OG) | 1200 × 630 px | 1.91:1 | What links look like in feeds and chats |
Hard limits: Shopify caps image uploads at 20 megapixels and 20 MB. You should never get near either — more on file size below.
Product images: why 2048 × 2048
Two reasons, both practical:
- Zoom. Product-page zoom works by having more pixels than the display size. At 2048px, a shopper can inspect stitching and labels; at 800px, zoom is a blur and might as well be off. Detail inspection is trust — especially for exactly the products where returns hurt.
- Square keeps every surface aligned. Collection grids, related-product rails, search results, and most themes assume consistent ratios. One 4:3 photo in a square grid pushes rows out of line and reads as carelessness.
If your source photos aren’t square, don’t stretch them — pad them onto a white square canvas. Our free image resizer has a one-click Shopify preset that does exactly this, in your browser, without uploading anything.
Upscaling is the one thing more pixels can’t fix: a 600px photo enlarged to 2048 is just a bigger blur. If the source is small, reshoot it — a phone can do it.
File size: the number nobody sets a budget for
Dimensions get all the attention; kilobytes decide how fast your store feels. A straight-off-the-phone photo is often 3–8 MB. A product page carrying six of those is a slow page on cellular, and slow pages lose shoppers before the images ever finish painting.
Working budgets that hold up well:
- Product images: under ~400 KB at 2048 × 2048. Easily achievable with JPEG or WebP at sensible quality.
- Hero banners: under ~500 KB — it’s the largest paint on your homepage.
- Anything above 1 MB: compress it before upload.
Shopify’s CDN does re-process uploads — it scales images per device and serves modern formats like WebP automatically — but starting from a lean, clean file always ends leaner. Our free image compressor runs entirely in your browser and typically cuts phone photos by 70–90% with no visible difference.
Formats: which to upload
| Format | Use for | Notes |
|---|---|---|
| JPEG | Photographs — most product imagery | The default; small and universal |
| WebP | Photographs, when your workflow produces it | ~25–35% smaller than JPEG at similar quality; convert free here |
| PNG | Logos, graphics, transparency | Huge for photos — don’t use it for them |
| GIF | Almost nothing | Use video for motion instead |
The one real mistake here is photographic PNGs: a product photo saved as PNG can be five times the size of a visually identical JPEG. If your catalog is full of them, converting is the cheapest speed win available.
Banners, logos, favicons
- Slideshows and heroes are theme-territory. Every theme crops differently, and most crop responsively — the same banner shows different slices on phone and desktop. Find your theme’s recommended size, then keep critical content (faces, product, text) in the center where no crop will eat it.
- Logos should be uploaded at twice their display width so they stay crisp on high-density screens. If your theme shows the logo 220px wide, upload at least 440px. Transparent PNG, or SVG if your theme accepts it.
- Favicons get one job: be recognizable at 32 pixels. The tile, not the wordmark.
Alt text: the invisible half of every image
Dimensions make images look right; alt text makes them findable and accessible. Shopify gives every image an alt field (truncated at 512 characters — you need far fewer), and it’s the single most neglected field in most catalogs. We wrote a separate guide on writing product alt text — it takes ten seconds per image and it’s one of the few image-SEO levers entirely in your control.
The pre-upload routine
- Shoot big, edit, crop to square (or pad with the resizer).
- Export at 2048 × 2048.
- Compress to a few hundred kilobytes.
- Name the file descriptively (
walnut-desk-organizer-front.jpg, notIMG_4302.jpg). - Upload, then write the alt text while you still remember the shot.
Five steps, once per image — or, since this is exactly the kind of work software should do, Imagefall runs sizing, compression, and alt text automatically on every asset it generates.