Shopify Product Image Sizes and Formats: A Practical Seller Guide
Shopify Product Image Sizes and Formats: A Practical Seller Guide Key Takeaways Shopify accepts JPEG, progressive JPEG, PNG, GIF, HEIC, and WebP, plus SVG with …
Key Takeaways
- Shopify accepts JPEG, progressive JPEG, PNG, GIF, HEIC, and WebP, plus SVG with limitations; TIFF and BMP files are accepted but converted to JPEG or PNG on upload.
- The hard ceiling for an uploaded image is 5000 × 5000 pixels or 25 megapixels, and uploads are also restricted by file size — so a huge, uncompressed master file can fail even when its pixel dimensions look acceptable.
- Format choice should follow image content: JPEG for product photography and slideshows, PNG for line drawings, text, and graphics that need transparency, SVG only when you accept that it cannot be resized or cropped without being rasterized.
- Uploading a single high-resolution master and letting Shopify handle delivery format is more reliable than trying to pre-convert every file yourself.
- Changing an image's file type after upload is not an in-place edit — you remove the image and upload the replacement, which is why getting the source file right the first time saves work.
1. Introduction
Product images are one of the few parts of a Shopify store that affect almost every metric a seller cares about: click-through from collection pages, time on product pages, return rates, and how the store looks on a phone in a crowded feed. Yet most image problems in real stores are not design problems. They are specification problems — a file that is too large to upload, a PNG screenshot that looks soft on a retina display, a transparent cutout that shows a white box, or a product photo that gets cropped through the top of the model's head in one theme but not another.
The confusion usually comes from mixing up three different things: what Shopify will accept at upload, what Shopify will deliver to a shopper's browser, and what a specific theme will display in a given slot. These are governed by different rules, and only the first two are controlled by the platform.
This guide separates those layers. It covers the formats Shopify supports and the real upload limits, how to choose a format based on what is inside the image, a practical framework for choosing pixel dimensions, and how to manage cropping with focal points. It is written for sellers who want a repeatable image workflow rather than a one-off fix.
2. What Shopify Actually Accepts, and Where the Limits Are
Core conclusion: Shopify's supported format list is broad, but the platform normalizes and converts files on the way in and on the way out. Knowing which conversions happen automatically prevents most upload surprises.
The formats Shopify supports directly are:
| Format | Typical use | Notes |
|---|---|---|
| JPEG | Product photography, lifestyle shots, slideshows | Millions of colors, lossy compression keeps file sizes manageable |
| Progressive JPEG | Same as JPEG, with gradual rendering | Useful for large hero images on slower connections |
| PNG | Line drawings, text overlays, logos, transparent cutouts | Larger files, but preserves sharp edges and transparency |
| GIF | Simple animations | Automatically converted to animated WebP to reduce file size |
| HEIC | Photos straight from newer iPhones | Accepted, but not ideal as a long-term master format |
| WebP | Modern web images | Good compression, widely supported |
| SVG | Icons and simple vector graphics | Supported but limited — cannot be resized or cropped without requesting a rasterized format (JPEG, WebP, PNG) |
| TIFF / BMP | Scans, exports from design tools | Accepted, but converted to JPEG or PNG on upload |
Two limits matter more than the format list. First, uploads are capped at 5000 × 5000 pixels or 25 megapixels. Second, uploads are also restricted by file size in addition to megapixels — a 25-megapixel TIFF and a 25-megapixel JPEG are treated differently in practice, because one is many times larger. If an upload fails despite dimensions that look legal, file size is the first thing to check rather than the last.
On the delivery side, Shopify serves modern formats automatically: when a shopper's browser supports WebP or AVIF, images are delivered in those formats, and animated GIFs are converted to animated WebP. This is the reason a seller does not need to manually export a WebP version of every product photo. Upload a good master; the delivery layer handles the rest.
Practical advice: keep one high-quality master file per image in your own archive, upload a version that sits comfortably under the megapixel ceiling, and do not pre-compress aggressively "for the web." You would be optimizing for a delivery pipeline that already does that work.
3. Choosing a Format Based on What Is Inside the Image
Core conclusion: Format should be chosen by image content, not by habit. The single most common mistake is using JPEG for graphics with text or transparency, and PNG for photographs.
JPEG uses lossy compression, which discards subtle color information the eye is unlikely to notice in a photograph. That is an excellent trade for a product shot with skin tones, fabric texture, and gradients. It is a poor trade for a graphic with hard edges, because lossy compression creates visible ringing and fuzz around sharp transitions. That is why line drawings, text overlays, size charts, and iconic graphics are better served by PNG, which preserves edges and supports transparency.
The practical mapping looks like this:
- Apparel and footwear on model or flat-lay: JPEG. The subject is photographic, the colors are complex, and the file needs to stay light enough for a gallery of six to ten images.
- Jewelry, watches, and metallic surfaces: JPEG at a higher quality setting, shot on a clean background. Metal highlights are where over-compression becomes visible first, so avoid re-saving the same JPEG repeatedly.
- Transparent cutouts for collection tiles or banners: PNG. If the theme places the image on a colored background, transparency is what keeps the product from sitting in a white rectangle.
- Size charts, care instructions, comparison graphics: PNG, or a text-rendered HTML block if the theme supports it. Text baked into a JPEG will look soft on high-density screens.
- Icons and simple logos: SVG where the theme allows it — but remember that SVG cannot be transformed on the platform side without being rasterized, so a responsive theme that crops or resizes that slot may force a conversion.
- Photos exported as HEIC from a phone: convert to JPEG before uploading as a master. HEIC is convenient for capture, less convenient as an archival format for a store.
One more consideration: transparency is not free. A PNG with a large transparent area can be significantly heavier than a JPEG of the same pixel dimensions. If the theme places the image on a plain white background anyway, a JPEG will often be the better engineering choice.
4. A Practical Framework for Choosing Pixel Dimensions
Core conclusion: Upload one master at roughly 2048 pixels on the long edge for most product images, go higher only when the shopping experience justifies it, and never exceed 5000 pixels or 25 megapixels.
The reasoning is straightforward. Product images appear at wildly different sizes across a store — a small thumbnail in a collection grid, a medium image in a quick-view modal, a large image in the product gallery, and a full-width image in a hero banner. Uploading at a size that covers the largest realistic display, with headroom for high-density screens, gives the theme room to work. Uploading at 5000 pixels for a thumbnail that renders at 300 pixels wastes storage and slows down admin work without improving what the shopper sees.
| Use case | Suggested upload size | Format |
|---|---|---|
| Main product gallery image | ~2048 px on the long edge, square 1:1 | JPEG |
| Zoom-enabled detail shots | 2048–3000 px on the long edge | JPEG |
| Collection thumbnails (if uploaded separately) | 800–1200 px | JPEG |
| Transparent product cutouts | 1600–2048 px | PNG |
| Size charts and text graphics | 1600–2048 px wide | PNG |
| Hero banner / slideshow | Up to 3000 px wide, under 25 MP | JPEG or progressive JPEG |
| Icons and simple logos | Vector source where supported | SVG |
Three cautions apply. First, do not upscale a small file to hit a target dimension; interpolation adds no detail and produces a soft image that looks worse than a smaller, sharp one. Second, keep aspect ratios consistent within a product's gallery — mixing 1:1 with 4:5 and 16:9 forces the theme to crop inconsistently and makes the gallery jump as the shopper scrolls. Third, treat 25 megapixels as a ceiling, not a goal. A 5000 × 5000 upload is allowed, but it is rarely necessary for a product photo and increases the chance of hitting the file-size restriction.
Square 1:1 remains the safest default for the main image because collection grids, quick-view modals, and marketplace syndication all handle squares predictably. Lifestyle and editorial images can break that rule, but the main image should anchor the set.
5. Focal Points, Cropping, and the Post-Upload Workflow
Core conclusion: Themes crop the same image differently in different slots. Focal points let you decide what stays in frame, and setting them takes seconds — but the underlying file still needs to be replaced, not edited, when the format changes.
To set a focal point in Shopify, open the image from wherever it lives in the admin — the Files section, the theme editor, the Media section of a product listing, the Shopify Messaging email editor, or a File reference metafield — then select the part of the image to anchor by clicking the image or dragging the blue dot, and save. To remove a focal point, open the image from the same locations, click Remove, and save as a new file.
The focal point matters most for images with off-center subjects: a model standing to the left of a wide frame, a pair of shoes photographed off-axis, a bottle with the label low in the composition. Without a focal point, a square crop of a wide image defaults to the center and can cut the subject.
If you need to change an image's file type — say a PNG that should have been a JPEG — there is no in-place conversion in the admin. The workflow is: go to the page with the image, click Edit, click Remove, save, refresh the page, then upload the new file with the format you want and save again. To confirm what you are actually looking at, open the image in a new tab and check the URL for the file extension, such as .png, .jpeg, or .gif.
Practical advice: before a bulk upload, standardize the source files once — correct format, consistent aspect ratio, long edge around 2048 pixels — so the admin work becomes upload-and-arrange rather than upload-diagnose-replace.
6. Format Comparison and Pre-Upload Checklist
| Decision | Choose this | Avoid this | Why |
|---|---|---|---|
| Photographic product shot | JPEG | PNG | Lossy compression is efficient for complex color; PNG balloons in size |
| Text or line art | PNG | JPEG | JPEG artifacts blur hard edges |
| Transparent cutout | PNG | JPEG | JPEG has no transparency channel |
| Simple animation | GIF (auto-converted to WebP) | Video file | Platform handles conversion and performance |
| Vector icon | SVG, if the slot does not need transformation | Rasterized SVG | SVG cannot be resized or cropped without rasterizing |
| Phone photo export | JPEG | HEIC as master | HEIC is a capture format, not an archival one |
| Scanned or design-tool export | JPEG or PNG | TIFF, BMP | These are converted on upload anyway |
Pre-upload checklist
- File is one of: JPEG, progressive JPEG, PNG, GIF, HEIC, WebP, SVG (with limits).
- Long edge at or below 5000 px, and total under 25 megapixels.
- File size comfortably within the upload limit for the account.
- Aspect ratio matches the rest of the gallery.
- No upscaling from a smaller source.
- Subject position noted so a focal point can be set after upload.
- Master file archived outside Shopify before any compression.
7. FAQ
Q1. What is the maximum image size Shopify accepts?
Shopify accepts images up to 5000 × 5000 pixels or 25 megapixels, whichever limit is reached first. Uploads are also constrained by file size, so a file within the pixel limit can still fail if it is heavy. For most product photography, uploading around 2048 pixels on the long edge is a more practical target than the maximum.
Q2. Should I upload PNG or JPEG for product photos?
JPEG for anything photographic — apparel, footwear, accessories, lifestyle scenes — because lossy compression keeps file sizes reasonable without visible damage to complex color. PNG for line drawings, text overlays, logos, and any image that needs transparency. Using PNG for photographs produces unnecessarily heavy files; using JPEG for text produces visible fuzz around letters.
Q3. Do I need to convert my images to WebP before uploading?
No. Shopify supports WebP uploads, and it also delivers images in modern formats such as WebP and AVIF when a shopper's browser supports them, with GIFs converted to animated WebP automatically. Manually pre-converting every file generally adds steps without improving the shopper's experience.
Q4. Can I change an image's file format after it is uploaded?
Not in place. You need to open the image, click Edit, remove it, save, refresh the page, and upload the replacement in the format you want. This is also why it is worth confirming the file extension by opening the image in a new tab before assuming the upload behaved as expected.
Q5. Why does my product image look cropped differently on different pages?
Because each theme slot has its own aspect ratio. A wide hero banner, a square collection tile, and a portrait gallery frame will crop the same source file differently. Setting a focal point tells the theme which part of the image to keep, but it cannot change the shape of the slot — that is a theme setting, not an image setting.
8. Conclusion
Getting Shopify product images right is less about chasing an ideal specification and more about controlling three variables: a supported format chosen for the image's content, dimensions that cover the largest realistic display without approaching the 5000-pixel or 25-megapixel ceiling, and a consistent aspect ratio across each product's gallery.
The platform absorbs a lot of the complexity for you. It converts TIFF and BMP on upload, serves WebP and AVIF where browsers support them, and turns GIFs into animated WebP. What it cannot do is fix a source file that was the wrong format to begin with, or decide which part of a wide photograph should survive a square crop.
A workable next step: audit your ten best-selling products, check each image's format and long edge, set focal points on any shot with an off-center subject, and standardize the master files in your own archive. That small pass usually resolves the most visible image problems across a store — and makes every future upload a one-step operation.