Shopify product image size guide 2026: recommended dimensions, formats, and limits

Shopify’s image story in 2026 is mostly the same as 2025 in terms of caps, but the recommended sizes drift downward every year as the platform serves more responsive variants. Larger sources do not buy you more quality past a certain point, and they do cost you in page speed. This is the up-to-date reference: every image type Shopify uses, the dimension that actually performs best, the maximum you can get away with, and the format to upload in.

We pulled the numbers from Shopify’s own help docs, current theme spec sheets, and our own testing of how the CDN serves resized variants. Where Shopify’s “official” recommendation is outdated or context-specific, we say so. Where it is right, we cite it.

If you are reading this because you got the “exceeds 25 MP” error and just want to fix that one image, our 25 MP image limit fix guide is the faster path. This post is the broader reference.

In this post

• The 2026 Shopify image size cheat sheet
• Product images: 2048 x 2048 (the size that actually matters)
• Collection images and product card thumbnails
• Hero and banner images
• Logo
• Favicon
• Blog featured images and inline images
• Social and Open Graph images
• Variant images and per-color media
• JPEG vs WebP vs AVIF vs PNG: what to upload
• Square vs rectangle: which aspect ratio to pick
• Mobile considerations (often forgotten)
• Frequently asked questions
• Related reading

The 2026 Shopify image size cheat sheet

Bookmark this section. It is the working reference.

Image type	Recommended size	Aspect	Max	File size target
Product image (main)	2048 x 2048 px	1:1	5000 x 5000 (25 MP)	100 to 300 KB
Product variant image	2048 x 2048 px	1:1	5000 x 5000	100 to 300 KB
Collection image	1024 x 1024 px	1:1 or 2:3	5000 x 5000	under 200 KB
Hero / slideshow	1920 x 1080 px	16:9	4472 x 4472 (20 MP)	under 500 KB
Hero (mobile)	800 x 1200 px	2:3 portrait	20 MP	under 300 KB
Logo (desktop)	400 x 200 px	2:1	any	under 100 KB
Favicon	32 x 32 px	1:1	32 x 32	under 16 KB
Blog featured	1200 x 800 px	3:2	20 MP	under 300 KB
Social / Open Graph	1200 x 628 px	1.91:1	20 MP	under 1 MB
Cart and checkout	200 x 200 px	1:1	(Shopify renders from product)	(rendered, not uploaded)

Two things worth noticing in this table:

• Product images cap higher than theme images. Product and collection contexts allow up to 25 MP / 5000 x 5000. Theme assets, hero, blog, and Files uploads cap at 20 MP / about 4472 x 4472. Same upload, different limit, depending on where it lives.
• The recommended size is much smaller than the cap. The cap exists to give photographers headroom; the recommended is what actually performs best on a customer’s screen. Aim for the recommended.

Product images: 2048 x 2048 (the size that actually matters)

This is the image people care most about. Shopify’s official recommendation is 2048 x 2048 pixels in a 1:1 square ratio, with a target file size of 100 to 300 KB after compression. Reasons:

• 2048 is enough resolution for retina (2x) displays at typical product page widths.
• Shopify’s image resizer serves variants down from the source. Anything over 2048 just wastes bandwidth without showing more detail.
• Most theme product page zoom maxes out around 2048 anyway.

When to go bigger. Jewelry, art prints, fabric textures, anything where customers actually do pixel-peeping zoom. Use 4096 or 5000 source images for those. Apparel, electronics, home goods, beauty: stick with 2048.

When to go smaller. If you have a deep catalog and your storage or bandwidth costs are biting (rare on Shopify, but possible at very high product counts), 1500 x 1500 still looks fine on most screens. Below 1024 x 1024, retina users start to see softness.

Shopify also requires images to be at least 800 x 800 for product zoom to activate. Below that and the zoom button does not appear. So 800 is the practical floor.

Collection images and product card thumbnails

Collection images render as the cover of a collection on category pages and in mega-menus. Recommended: 1024 x 1024 pixels, 1:1. Some themes use 2:3 portrait collection covers (apparel themes especially). Match what your theme uses.

Product card thumbnails on collection pages do not need a separate upload. Shopify generates them from the product’s first image automatically. The cleaner that first image is at 2048 x 2048, the cleaner the thumbnail will be at every served size (300 wide on collection card, 600 on product card hero, etc.).

Hero and banner images

Two recommendations depending on where the hero lives:

• Full-width hero / homepage banner: 1920 x 1080 px (16:9), under 500 KB.
• Slim slideshow banners: 1200 to 2000 px wide, 400 to 600 px tall.
• Mobile hero: 800 x 1200 px (portrait 2:3) is the safe choice. Many themes serve a mobile-specific image; check your theme settings for “Mobile image” upload slots.

Practical tip: if your hero has text overlaid (CTA copy, headlines), keep critical text in the central 60% of the canvas. Themes crop hero images on smaller breakpoints and you do not want your headline cropped.

Logo

Recommended: 400 x 200 pixels as a transparent PNG. The transparency matters because most themes have a white header for desktop and a colored or photo-overlay header for mobile, and a solid-background logo will look stuck on one of them.

Optimal aspect: 2:1 horizontal works for most themes. If your logo is a square mark (1:1), upload it at 250 x 250. SVG is also accepted and scales infinitely; if your designer can give you an SVG, prefer it over PNG.

Favicon

Recommended: 32 x 32 pixels in PNG or ICO format. Some themes accept 16 x 16 too. Anything larger gets resized down by Shopify automatically, which sometimes muddies fine detail.

Set under Online Store > Themes > Customize > Theme settings > Favicon. The favicon is what shows in browser tabs and bookmark icons. A simplified version of your logo (just the mark, not the wordmark) reads better at 32 px than the full logo squished down.

Blog featured images and inline images

Blog featured (the cover image on a blog post and on the blog listing page): 1200 x 800 pixels at 3:2. Some themes use 16:9, in which case 1200 x 675 works.

Inline images within a blog post body: there is no fixed standard. The blog post body width is usually 600 to 800 pixels rendered, so 1200 to 1600 wide source gives retina sharpness. Compress to under 200 KB per image. A blog post with 8 inline images at 800 KB each is a slow page; aim for under 1.5 MB total page weight.

Social and Open Graph images

When someone shares your store URL on Facebook, X, LinkedIn, WhatsApp, or in iMessage, the platforms render an Open Graph card. Shopify auto-generates the og:image from your product or page, but you can override it.

Recommended: 1200 x 628 pixels (1.91:1 aspect), under 1 MB. This is the spec for Facebook’s og:image, X’s twitter:image, and LinkedIn’s preview. Critical content centered (these crop on smaller previews).

Set the og:image globally under theme settings (most themes have a “Default sharing image” slot). For per-product overrides, use the SEO and social meta fields on the product page, or a meta-tag editor app.

Variant images and per-color media

Variant images use the same dimensions as product images: 2048 x 2048. The complications are:

• Shopify natively supports one image per variant. If you want multiple images per variant (lifestyle, on-white, detail), you need an app like Rubik Variant Images that supports per-variant media groups.
• Variant swatches (the colored circles on the product page) are usually rendered from a separate small image (24 x 24 to 64 x 64) or a hex code stored in metafields. Themes vary.
• If you have separate-product-per-color setups (common in apparel), each color is its own product with its own 2048 image. Linking them with combined listings creates the unified UX without changing the underlying images.

For a deeper read on variant image structure (including the AI shopping discovery angle): our post on how variant grouping affects AI shopping discovery.

JPEG vs WebP vs AVIF vs PNG: what to upload

Format	Best for	File size vs JPEG	Browser support
JPEG	Photos, default choice	Baseline	Universal
WebP	Photos with smaller files	25 to 35% smaller	All modern browsers
AVIF	Photos with smallest files	40 to 50% smaller	All modern browsers
PNG	Logos, icons, transparency	2 to 4x larger	Universal
HEIC	Direct iPhone uploads	30 to 40% smaller than JPEG	Shopify accepts; serves as JPEG/WebP
GIF	Animated only	Large; cap at 5 MP	Universal
SVG	Logos, icons (vector)	Tiny; scales infinitely	Universal

Practical guidance: upload JPEG or WebP for photos. Use PNG only for transparency. Use SVG for logos when you have it. Shopify will serve WebP to compatible browsers automatically even if you upload JPEG, so you do not need to worry about manually converting your whole catalog. The format you upload matters mostly for source-side file size and storage, not for storefront delivery.

Square vs rectangle: which aspect ratio to pick

Picking an aspect ratio is a one-time decision that affects how every product looks on collection pages, in cart, and in search. Three common options:

• 1:1 (square). The Shopify default. Most universal. Works for apparel, beauty, home goods, electronics. Almost every theme renders 1:1 cleanly.
• 2:3 (portrait). Common in apparel and footwear. Models photographed full-body fit better in portrait. Some themes have a “tall product image” toggle for this.
• 4:3 or 3:4 (rectangle). Furniture and home decor sometimes use these for landscape product shots that show context (a couch in a room, not a couch on white).

The biggest mistake is mixing aspect ratios across products in the same store. Collection pages with mixed 1:1 and 2:3 images look chaotic. Pick one for your whole catalog and stick to it. If you must mix (e.g., 1:1 for accessories, 2:3 for clothing), at least pick one ratio per category collection.

Mobile considerations (often forgotten)

Over 70% of Shopify store traffic is mobile. The desktop-recommended sizes mostly work, but a few mobile-specific notes:

• Hero images crop differently on mobile. Most themes crop landscape hero down to a square or portrait crop on phones. If you have text overlay, keep it in the center 60% of the canvas.
• Mobile-specific hero slots exist in many themes. Use them. A 1920 x 1080 desktop hero scaled down to phone width is wasteful; a 800 x 1200 portrait mobile hero loads faster and looks better.
• Product page galleries typically show 1:1 product images even on mobile. The 2048 source still works, but compression matters more (slower mobile networks). Aim for the lower end of the 100 to 300 KB target on mobile-heavy stores.

Test on your phone after every theme change. The desktop preview lies about how things actually look on a 6-inch screen.

Frequently asked questions

What is the best image size for Shopify product pages in 2026?

Shopify recommends 2048 x 2048 pixels in a 1:1 square aspect ratio for product images, with a file size target of 100 to 300 KB after compression. This balances retina-display quality with page load speed. The minimum for product zoom to activate is 800 x 800.

What is the maximum image size Shopify allows?

Product and collection images cap at 5000 x 5000 pixels (25 megapixels) and 20 MB file size. Theme assets, hero images, blog images, and Files uploads cap lower at 4472 x 4472 (20 megapixels). Animated GIFs cap at 5 megapixels.

What aspect ratio should Shopify product images use?

1:1 square is the most universal and works in almost every theme. 2:3 portrait is common in apparel and footwear. 4:3 landscape suits furniture and home decor. The most important rule is consistency across your catalog: mixing aspect ratios on the same collection page looks unprofessional.

Should I upload JPEG or WebP to Shopify?

Either works. Shopify automatically serves WebP to compatible browsers regardless of what you upload. WebP source files are about 25 to 35% smaller than JPEG, which saves on storage and upload time. JPEG is the safer default if you are not sure. PNG should be reserved for logos, icons, and images with transparency.

What size should my Shopify favicon be?

32 x 32 pixels in PNG or ICO format. Shopify resizes larger uploads automatically, but the result can look muddy at favicon dimensions. Upload at 32 x 32 to control the rendering. Place the favicon under Online Store > Themes > Customize > Theme settings > Favicon.

What is the recommended size for Shopify hero or banner images?

1920 x 1080 pixels (16:9 aspect ratio) for desktop, with file size under 500 KB. For mobile-specific hero slots, 800 x 1200 (2:3 portrait) is the safe choice. Keep critical text and call-to-action elements in the central 60% of the canvas to survive responsive cropping.

Does Shopify support transparent PNG product images?

Yes, Shopify accepts transparent PNG. Themes render the transparency correctly on light or dark backgrounds. The drawback is file size: a transparent PNG product photo is typically 2 to 4 times larger than a JPEG of the same dimensions, which slows your storefront. Use transparent PNG for logos and icons; use JPEG or WebP for photographed products even if you remove the background.

Related reading

• Shopify 25 MP image limit fix guide
• Shopify image optimization for faster load times
• Shopify product images best practices
• Shopify product image SEO guide
• Bulk resize Shopify images
• Rubik Variant Images for multiple images per variant in the same dimensions
• Rubik Combined Listings for unifying separate-product-per-color setups

One mental model that helps: think of your image source files as the negative, and Shopify’s CDN as the print shop. You only need a negative big enough to print every poster size you sell. Going bigger costs storage with no payoff. Going smaller saves bytes but limits your max print size. 2048 x 2048 is the sweet spot for almost every store; deviate only when your specific product genuinely needs more.