Picovert

Shopify Image Size Guide — Product, Banner, and Logo Dimensions

By Picovert Team2026-03-295 min read

Shopify has specific image requirements for each image type, and using the wrong size causes blurry product photos, broken layouts, or slow page loads that hurt conversion rates. This guide covers the correct dimensions for every Shopify image type — product images, banners, collection images, logos, and more.

Shopify Image Sizes — Quick Reference

  • Product images: 2048×2048 px (square, 1:1)
  • Collection / category images: 1800×1000 px (16:9)
  • Hero / slideshow banner: 1800×600 px to 2000×800 px
  • Logo: 450×250 px maximum
  • Blog post featured image: 1200×675 px (16:9)
  • Favicon: 32×32 px (or 16×16 px)
  • Max file size: 20 MB per image
  • Supported formats: JPG, PNG, GIF, WebP

Product Image Size for Shopify

Shopify recommends 2048×2048 px square for product images. Here's why:

  • Square (1:1) ratio: All Shopify themes display product images in a consistent square grid. Non-square images get letterboxed or cropped depending on the theme — use square images to avoid unexpected cropping.
  • 2048 px: Large enough to support Shopify's built-in zoom feature. When customers zoom in on product images, Shopify scales up to the uploaded resolution. Uploading at 2048 px means zoom looks sharp.
  • Consistency: All product images in a collection should be the same ratio. Mixed ratios make the product grid look uneven.

If your product images are rectangular (e.g., a banner product or clothing flat lay), you have two options: crop to square, or use a consistent ratio across all products (Shopify allows any ratio as long as all images in a store match).

Hero Banner / Slideshow Image Size

Shopify hero banners (the full-width images on your homepage) display at different widths depending on the customer's screen. A safe size that works well across devices:

  • Width: 1800–2000 px (covers most desktop monitors)
  • Height: 600–800 px (for standard banners) or 1080 px (for full-height hero)
  • Aspect ratio: approximately 3:1 to 2.5:1 for standard banners
  • File format: JPG for photos (500 KB–1 MB), PNG for text-heavy graphics

Keep hero banners under 1 MB for fast above-the-fold loading. A slow hero image directly hurts LCP (Largest Contentful Paint) and conversion rates.

Collection Image Size

Collection images appear on your collection listing pages (e.g., "Women's Shoes", "Summer Collection"). Recommended size:

  • 1800×1000 px (16:9) for landscape collection images
  • 800×800 px (1:1) for square collection thumbnails

Logo Size for Shopify

Shopify themes limit logo display to a max width of 450 px. Upload dimensions:

  • Max size: 450×250 px
  • Format: PNG with transparent background (shows correctly on any header color)
  • For retina displays: Upload at 2× (900×500 px) — Shopify will display it at half size

Shopify Image File Size Limits

Shopify accepts images up to 20 MB per file, but large images cause slow stores. Practical targets:

  • Product images: under 500 KB (Shopify auto-optimizes and serves via CDN, but smaller originals mean less processing)
  • Banner images: under 1 MB
  • Logo: under 100 KB

Shopify automatically compresses images and serves them via its global CDN. However, it works best when the original upload is already optimized — Shopify's compression is lossy and adds JPEG artifacts if the original is too large.

WebP Support in Shopify

Shopify automatically converts uploaded images to WebP and serves WebP to browsers that support it (all modern browsers). This means:

  • You can upload JPG or PNG — Shopify handles the WebP conversion
  • Uploading WebP directly is also supported
  • Shopify uses responsive images (srcset) to serve the right size for each screen

How to Prepare Shopify Product Images

  1. Shoot or source product photos at high resolution (at least 2000 px on the short side).
  2. If the image isn't square, use the crop tool to crop to a 1:1 ratio. Center the product with some white space around it.
  3. Use the resize tool to set the image to exactly 2048×2048 px.
  4. Use the compressor to bring the JPG file under 500 KB at 80–85% quality.
  5. Save as JPG for product photos, PNG for images with transparency (e.g., removed background on white).

Common Shopify Image Problems

  • Product grid looks uneven: Images have mixed aspect ratios. Standardize all product images to 1:1 (square) to fix.
  • Product images look blurry on zoom: Images were uploaded too small (under 1000 px). Use at least 2048 px.
  • Page loads slowly: Banner or product images are too large (over 2 MB). Compress and resize before uploading.
  • Logo looks blurry on retina screens: Logo uploaded at display size instead of 2×. Upload at 900×500 px for a 450×250 px display logo.
  • Logo background visible on colored header: Logo uploaded as JPG (white background). Re-export as PNG with transparent background.