Shopify Image Sizes: The Complete Guide for 2026
By The tinify.ai Team
You upload a banner, it looks great on your laptop, and on your phone the sale text is cropped behind the edge of the screen. Or your product photos look sharp in your camera app and blurry on the product page. Wrong Shopify image sizes cause this, and the fix takes minutes once you know the right numbers.
Getting the sizes wrong has real costs: slow stores, pixelated product photos, banners with cropped text, and layouts that jump as they load. Any of those can push a visitor off your store before they buy. Research puts the conversion penalty at approximately 4.42% for every additional second your store takes to load (Portent research).
This guide gives you the exact pixel dimensions, aspect ratios, and file size targets for every image type in a Shopify store, in plain language, with a clear explanation of why each number matters for how your store looks and performs.
Shopify Image Sizes at a Glance
Here are the recommended dimensions for every major Shopify image type. These are the sizes Shopify itself recommends or that produce the best results across the most common themes. Use these as your starting point. The sections below explain what happens when you get them wrong.
| Image Type | Recommended Size | Aspect Ratio | Max File Size Target | Key Rule |
|---|---|---|---|---|
| Product image | 2048 × 2048 px | 1:1 (square) | Under 500 KB | Enables zoom; square prevents cropping across themes |
| Hero / banner | 1920 × 1080 px | 16:9 | Under 300 KB | Keep all text/CTA in central 1200 px (mobile clipping) |
| Collection image | 1024 × 1024 px (most themes) or 1200 × 1600 px (Dawn) | Varies by theme | Under 200 KB | Dawn crops to 3:4 portrait by default |
| Logo | 400 × 200 px | ~2:1 | Under 100 KB | SVG preferred; PNG fallback with transparent background |
| Favicon | 32 × 32 px | 1:1 | Under 20 KB | Shopify auto-generates from logo if not set separately |
| Blog featured image | 1800 × 1000 px | 16:9 | Under 250 KB | Matches social sharing dimensions |
| Social / OG image | 1200 × 630 px | 1.91:1 | Under 200 KB | Required for Facebook/LinkedIn preview cards |
Getting the dimensions right is step one; getting the file size right is step two. In tinify.ai's compression dataset of 905 real images, JPEG files converted to WebP averaged an 81% reduction in file size, and images over 2MB averaged a 90% reduction. The sections below cover both steps for each image type. For a deeper look at how image optimization affects your store's Google rankings and load speed, see Shopify Image Optimization: Why It Matters for Speed and Sales.
What Size Should Shopify Product Images Be?
Shopify recommends 2048 × 2048 pixels for product images, at a 1:1 (square) aspect ratio. Square images prevent awkward cropping across different themes. The 2048 px size ensures your product photos stay sharp on Retina screens and when customers zoom in, and Shopify's zoom feature requires at least 800 px on the shortest side to activate.
Why square matters for product photos
Aspect ratio is the shape of an image: square, landscape, or portrait. A 1:1 ratio is square. Shopify themes crop images to match the dominant shape used across your product catalog. Upload a mix of portrait and landscape product photos and the theme picks one shape and clips everything else.
Square (1:1) is the safe default because it works in every major Shopify theme without cropping. Consistent product grids depend on consistent aspect ratios. If your photos aren't square, the theme decides what to crop, and that's rarely a decision you want to leave to the software.
The business case is direct: product pages where customers can zoom in convert better, because shoppers can inspect texture and detail before committing. Zoom requires a minimum of 2048 px. Upload product photos at 800 × 800 px and zoom works, but looks blurry when customers use it. At 2048 × 2048 px, zoom stays sharp on every screen.
File size target for product images
Target under 500 KB per product photo. A typical photo from a smartphone or DSLR comes in at 4–8 MB. That gap matters: a product page with five images at 4 MB each puts 20 MB of data between your visitor and a usable page. Shopify's hard cap is 20 MB per image, a ceiling, not a target. Uploading anywhere near that limit makes your product pages very slow.
The format you choose also affects file size. For a full comparison of WebP, JPEG, and PNG for Shopify product photos, see WebP vs JPEG vs PNG for Shopify: Which Format Wins in 2026.
What Is the Best Image Size for a Shopify Banner or Hero Image?
The standard Shopify banner or hero image size is 1920 × 1080 pixels, a 16:9 widescreen ratio. This fills a full-width desktop screen at common monitor resolutions. For file size, target under 300 KB. A banner over 1 MB will slow your homepage and push your store past the 3-second load threshold on mobile connections.
The mobile safe zone: the most common banner mistake
Most guides tell you the right banner dimensions and stop there. On mobile, your 1920 px-wide banner displays on a screen that's roughly 375–428 px wide. Shopify and most themes scale the banner down to fit and crop the sides. The outer 360 px on each side of a 1920 px banner are clipped on most mobile screens.
That's roughly the left 19% and right 19% of your banner gone for mobile visitors, and mobile accounts for the majority of Shopify traffic for most stores.
The rule: keep all text, CTAs, and logos within the central 1200 px of the banner, roughly the center 63% of the image width. Anything outside that band risks disappearing on mobile.
What this looks like in practice: if your banner reads "SUMMER SALE" and the word "SALE" sits near the right edge of the image, mobile visitors may only see "SUMMER." If your "Shop Now" button is in the bottom-right corner, it may be invisible on phones. Center your message. Leave generous blank space on both sides.
Height variation: short vs. tall banners
Not every store uses the full 1920 × 1080 px height. A shorter banner, 1920 × 600 px or 1920 × 800 px, shows less of the image but reveals more product content below the fold. Taller banners have more visual impact and create a stronger first impression; shorter banners make your products more visible without scrolling.
There's no single right answer. If your store sells visually striking products and brand presentation is a priority, a taller banner earns its space. If you sell a wide catalog and want visitors to see products without scrolling, a shorter banner keeps the focus on the goods. Most themes let you control this height setting without changing the image itself.
What Aspect Ratio Should I Use for Shopify Collection Images?
For most Shopify themes, 1:1 (square, 1024 × 1024 px) is the safe default for collection images. However, aspect ratio depends on your theme. The Dawn theme, Shopify's most widely used default, crops collection images to a 3:4 portrait ratio, making 1200 × 1600 px the better upload spec if you're on Dawn.
Theme-specific collection image specs
Most guides give you one number for collection images. Shopify's most popular themes display collection images in different shapes. Upload the generic 1024 × 1024 px recommendation to a Dawn store and your images will be cut off at the top and bottom, because Dawn crops to portrait, and a square doesn't fit a portrait frame.
Here are the specs by theme:
| Theme | Display Ratio | Recommended Upload Size |
|---|---|---|
| Dawn (Shopify default, most widely used) | 3:4 portrait | 1200 × 1600 px |
| Sense | 1:1 square | 1024 × 1024 px |
| Debut (legacy, still widely used) | 3:2 landscape | 1200 × 800 px |
| Craft | 3:4 portrait (same as Dawn) | 1200 × 1600 px |
Before uploading a full collection's worth of images, check which theme you're on and what ratio it uses. The wrong ratio means every collection page looks slightly off: images that should be square appear cropped to a rectangle, or portrait photos look stretched.
The cost goes beyond aesthetics: mismatched collection image ratios cause layout shift, where your page visually jumps around as it loads because images settle into their containers at different sizes. Layout shift is a direct Google ranking signal. Stores with persistent layout shift rank lower than stores that load clean. For more on how Google's ranking signals interact with your images, see Image SEO for E-commerce: How Google Reads Your Product Photos.
Logo, Favicon, and Blog Image Sizes
Shopify logo size: 400 × 200 px maximum, SVG preferred (scales perfectly on all screens), PNG with a transparent background as a fallback. Favicon: 32 × 32 px. Blog featured image: 1800 × 1000 px, which matches the 16:9 social sharing ratio used when your post is shared on Facebook, LinkedIn, or X.
Logo
SVG is the best format for logos because it scales to any size without going blurry or pixelated, important when your header logo needs to look sharp on a 5K monitor and a small phone screen at the same time. If SVG isn't available, upload a 400 × 200 px PNG with a transparent background. Avoid logos with white backgrounds, they look wrong on colored or dark headers and signal an amateur setup.
Shopify's admin accepts logos up to 450 px wide, but 400 × 200 px is the commonly recommended size that works across themes.
Favicon
A favicon is the small icon in the browser tab next to your store name. Shopify will auto-generate one from your logo if you don't upload a custom one. For a custom favicon: 32 × 32 px, in .ico or .png format. Keep it simple, because at 32 × 32 px, only bold, simple shapes read clearly.
Blog featured image
Use 1800 × 1000 px for blog featured images. This covers both the in-post display and the Open Graph image that social platforms pull when someone shares your blog link. Getting this right means your blog posts look polished when shared on social, a clean, well-framed preview image instead of a stretched or incorrectly cropped thumbnail. Target under 250 KB for file size.
Why Are My Shopify Images Blurry After Uploading?
Blurry Shopify images are almost always caused by uploading images that are too small. Shopify stretches undersized images to fill the display container, and the result looks pixelated. The fix: upload at or above the recommended size. For product images, that means at least 800 × 800 px minimum, and 2048 × 2048 px for zoom support.
The most common causes, and how to fix each one
1. The image is too small. This is the most common cause by a significant margin. If your product photo was originally 600 × 600 px and your theme displays it at 1000 × 1000 px, Shopify has to stretch it, and stretched images go blurry. The fix is to re-export or re-take the photo at the correct dimensions. There's no software fix for an image that was captured at too-low resolution.
2. The file was over-compressed before uploading. Some sellers run photos through a compression tool and drop the quality to 40–50% to reduce file size, then upload that degraded version to Shopify. The result is blurry, artifact-heavy product photos that look worse than the original. Compress to a file size target (under 500 KB) while keeping quality above 80%. A good tool gets you there without visible quality loss.
3. Wrong format for the image type. JPEG compression works well for photos with gradual color transitions. It works badly for logos, graphics, and anything with sharp edges or text; these look muddy in JPEG at any reasonable file size. For logos and graphics with text or hard edges, use SVG or PNG. For photographs, use JPEG or WebP.
4. Retina display mismatch. Retina screens, used in iPhones, recent MacBooks, and many Android phones, display at twice the pixel density of a standard screen. Upload a product photo at exactly 1024 × 1024 px and a Retina screen shows it at an effective resolution of 512 × 512 px, which looks blurry. The fix: upload at 2× your intended display size. For a product image displayed at 1024 px, upload at 2048 px. For image SEO implications of photo quality, see Image SEO for E-commerce: How Google Reads Your Product Photos.
What Is the Shopify Image File Size Limit — and What Should You Target?
Shopify's hard limit is 20 MB per image. But uploading near that limit will make your store slow. For fast loading, target under 500 KB for product images, under 300 KB for banners, and under 200 KB for collection images. In tinify.ai's compression dataset of 905 real images, JPEG files converted to WebP averaged an 81% reduction in file size, and images over 2MB averaged a 90% reduction.
What oversized images actually cost you
Consider a realistic homepage: a 1920 × 1080 px banner at 3 MB, plus six featured product photos at 4 MB each. That's 27 MB of images a visitor's browser has to download before the page is usable. On an average 4G mobile connection at around 10 Mbps, that's over 20 seconds to full load.
Google's research found that 53% of mobile users leave a page that takes more than 3 seconds to load. That's not a conversion rate penalty, it's more than half your mobile visitors gone before they've seen a single product. Every megabyte you shave off your images is a fraction of a second you recover, and that fraction compounds when you're losing visitors at the 3-second cutoff.
The math: hit that file size target (under 500 KB for product images, under 300 KB for banners) and a page with 10 images sits at under 5 MB total, fully loadable in under 4 seconds on mobile, under 1 second on a decent broadband connection.
How format choice affects file size
The format you upload matters, even at the same visual quality. WebP files are typically 25–35% smaller than the same image in JPEG at equivalent quality. PNG files for photographs are often much larger than either. For a full breakdown of which format to use for each image type in your Shopify store, see WebP vs JPEG vs PNG for Shopify: Which Format Wins in 2026.
Frequently Asked Questions
Q: What size should Shopify product images be?
Shopify recommends 2048 × 2048 pixels for product images, using a 1:1 square aspect ratio. Square prevents cropping across themes. The 2048 px size enables Shopify's zoom feature on product pages, which requires a minimum of 800 px on the shortest side. Target file size is under 500 KB. JPEG or WebP are the best formats for product photos.
Q: What is the best image size for a Shopify banner or hero section?
The standard Shopify banner and hero image size is 1920 × 1080 pixels (16:9 ratio). Target file size is under 300 KB to avoid slowing your homepage. On mobile, the outer ~360 px on each side of the banner is cropped. Keep all text and CTAs within the central ~1200 px of the image to ensure they're visible on phones.
Q: What aspect ratio should I use for Shopify collection images?
The safe default is 1:1 (square), 1024 × 1024 px. But it depends on your theme. Shopify's Dawn theme crops collection images to a 3:4 portrait ratio, so if you're on Dawn, upload at 1200 × 1600 px instead. Debut uses a 3:2 landscape ratio (1200 × 800 px). Check your theme before uploading a full collection's worth of images.
Q: Why are my Shopify images blurry or pixelated after uploading?
Blurry images are almost always caused by uploading images that are too small. Shopify stretches them to fill the container. For product images, upload at least 2048 × 2048 px. Also check that you haven't over-compressed the file before uploading (keep quality above 80%). For logos and graphics, use SVG or PNG instead of JPEG to avoid blurriness on text and sharp edges.
Q: What is the maximum image file size Shopify allows, and what size should I target for fast loading?
Shopify's hard limit is 20 MB per file, but uploading anywhere near that will make your store slow. For fast loading, target under 500 KB for product images, under 300 KB for banners, and under 200 KB for collection images. A typical 4 MB product photo can be reduced to under 200 KB without any visible quality loss using a tool like tinify.ai.
Getting It Right from Here
Every Shopify image type has a right size, and the right size is the one your theme displays at. The generic numbers (2048 × 2048 px for products, 1920 × 1080 px for banners) are reliable starting points. Collection images in particular require you to check your specific theme, because Dawn and Debut behave very differently from the generic recommendation.
The two highest-impact things you can do right now: resize your product photos to 2048 × 2048 px square, and compress them to under 500 KB. Most Shopify stores carry product photos at 3–5 MB each. Getting those under 500 KB is the difference between a store that loads in under 3 seconds and one that takes 10 or more, which is the difference between a visitor who browses and one who leaves.
tinify.ai handles both steps in one. Upload your Shopify images and get back the right-sized, optimized file, ready to upload directly to your product pages. No account needed, free with daily credits.
References
- tinify.ai internal compression dataset, 905 completed jobs, May 2026. JPEG→WebP: average 81% file size reduction (n=179). Images over 2MB: average 90% reduction (n=260). Median reduction across all successful compression jobs: 78%.
- Google/SOASTA Research: "The State of Online Retail Performance" — 53% of mobile site visits are abandoned if pages take longer than 3 seconds to load.
- Portent Research: each 1-second delay in page load time corresponds to approximately 4.42% reduction in conversion rate (0–5 second window).
Try tinify.ai free
Compress, resize, upscale, and tag images in one click. 20 free daily credits — no signup needed.