Shopify image sizes: the right dimensions for every slot

The best Shopify image sizes are 2048 x 2048 px for product photos, about 3000 px wide for full-width banners and slideshows, 2200 px wide for blog featured images, and 600 px wide for a logo. Every image must stay under 20 MB. The rule behind all of these is the same: upload about twice the width your theme actually displays, so pictures stay sharp on high-density phone and laptop screens.

Below is the full cheat sheet, the reasoning for each number taken from the code of Shopify's own Dawn theme, and a two-minute way to check the sizes your theme needs.

On this page

• Shopify image sizes cheat sheet
• Shopify's upload limits and formats
• Best size for Shopify product images
• Shopify collection image size
• Shopify banner and slideshow image size
• Shopify blog image size
• Logo and favicon size
• How to check the sizes your own theme needs
• Five image mistakes that slow a store down
• FAQ

Shopify image sizes cheat sheet

Use this table when you prepare a batch of images. The "largest width shown" column is what Dawn, Shopify's default theme, displays at its default 1200 px page width. The upload size doubles that, then rounds up to a clean number.

Image	Upload size	Shape	Largest width shown (Dawn)
Product image	2048 x 2048 px	1:1 square	715 px on the product page
Product card (collection grid)	Same file as above	1:1 or 4:5	268 px
Collection image	2048 x 2048 px	Match your card setting	367 px in a 3-column list, 550 px in the banner
Banner or slideshow	3000 px wide, e.g. 3000 x 1200 px	Your choice, keep every slide the same	Full screen width
Blog featured image	2200 x 1238 px	16:9	1100 px
Logo	600 px wide	Any	Up to 300 px (theme setting)
Favicon	Square, any size	1:1	32 x 32 px

If you use a different theme, the method still holds. Find the largest width your theme shows, double it, and stay inside Shopify's limits. The section on checking your own theme shows how.

What are Shopify's upload limits and formats?

Shopify's product media help page says product and collection images must be smaller than 20 MB and can be up to 5000 x 5000 px, or 25 megapixels. It also says 2048 x 2048 px "usually displays best" for square product images.

Shopify's theme images help page gives a tighter limit of 20 megapixels and 20 MB, while also mentioning 5000 x 5000 px. The two pages disagree, so stay under 20 megapixels and you are safe on both. In practice that means no larger than 4472 x 4472 px for a square, because 4472 x 4472 = 19,998,784 pixels.

Accepted formats on the theme images page are JPEG, progressive JPEG, PNG, GIF, HEIC and WebP. The same page says Shopify detects which formats a shopper's browser supports and serves the image through its CDN, so you do not need to convert files to WebP yourself.

Which format should you upload? Shopify's product media page says PNG is the best file type for most product images, followed by JPEG. Use PNG for logos, icons and anything with flat color or transparency. For large lifestyle photos and banners a high-quality JPEG is usually far smaller, and Shopify converts it for delivery anyway.

What is the best size for Shopify product images?

Upload product images at 2048 x 2048 px, square. That is Shopify's own recommendation, and Dawn's code shows why it works.

On the product page, Dawn's "large" media setting gives the main image 65% of the content area. At the default 1200 px page width, the content area is 1100 px, so the image is shown at about 715 px wide. A phone or laptop with a 2x screen needs 1,430 real pixels to fill that sharply. Dawn's image code offers versions up to 1946 px wide for this slot, and the zoom view benefits from extra detail. A 2048 px file covers all of it with room to spare.

Square matters as much as size. Shopify's help page says main product images need a consistent aspect ratio so they line up on collection pages. If one product is square and the next is tall, the grid looks broken.

Worked example: what happens to a portrait photo in a square grid

Say your photographer delivers 1600 x 2000 px portrait shots (4:5) and your theme shows square product cards. To fill a square, the theme crops the photo to 1600 x 1600 px. That cuts 400 px of height, which is 400 / 2000 = 20% of the picture. If the product sits close to the top or bottom edge, part of it disappears from the grid.

You have two clean fixes. Switch the theme's product card setting to portrait so the full 4:5 shot shows, or reshoot with space around the product and crop to 2048 x 2048 px before upload. Do not mix both shapes in one collection.

Shopify product image dimensions for zoom

Zoom only helps if there is extra detail to show. A 2048 px image zoomed in a lightbox shows real texture on fabric, stitching and labels. Anything far below that turns soft when the shopper zooms. If you sell products where close-up detail sells, such as jewelry or textiles, go up toward 4000 px, still under the 20 megapixel limit.

What size should Shopify collection images be?

Use 2048 x 2048 px for collection images, in the same shape as your product cards. In Dawn, a collection list with three columns shows each collection image at about 367 px wide, and the collection page banner shows it at 550 px. Doubled, that is 734 px and 1,100 px, so a 2048 px file covers both with headroom.

The exception is a one-column collection list, where Dawn shows the image across the full 1100 px content width. If you use that layout, upload 2200 px wide.

Keep every collection image the same shape. Mixed shapes make the collection list look uneven in the same way mixed product photos do.

What is the Shopify banner and slideshow image size?

Upload banner and slideshow images at 3000 px wide. Dawn's image banner and slideshow sections stretch to the full width of the screen, and the code offers versions from 375 px up to 3840 px wide. A 1440 px laptop screen with a 2x display needs 2,880 real pixels across, so 3000 px is the smallest clean number that stays sharp there.

Height is a design choice, not a Shopify rule. A 3000 x 1200 px image (5:2) gives a short, wide hero that leaves products visible below it. A 3000 x 1688 px image (16:9) fills more of the screen. Whatever you pick, use the same size for every slide so the slideshow does not jump in height.

How to stop banners cropping badly on mobile

On a phone, a wide banner is either shrunk or cropped at the sides. Three habits keep it readable:

• Set a focal point on the image in the theme editor. Shopify's help page says focal points always stay in frame, even when the theme crops the image.
• Keep the subject in the middle third of the frame, with empty space at the sides.
• Do not bake text into the image. Add headings and buttons with the theme's text settings, so they stay readable at every width.

What is the best Shopify blog image size?

Upload blog featured images at 2200 x 1238 px (16:9). Dawn shows the article's featured image across the full content width, which is 1100 px at the default page width, and the code offers a 2200 px version for 2x screens. Keep the subject near the center, because blog listing cards in some themes crop the edges.

Images inside the post body rarely need to be that big. Most blog text columns are well under 1000 px wide, so 1200 to 1600 px wide is plenty for in-post images. Always add descriptive alt text. It helps people using screen readers, and it is part of the basic on-page work in our Shopify SEO checklist.

What size should a Shopify logo and favicon be?

Upload your logo at 600 px wide. Dawn lets you set the logo width between 50 and 300 px in the theme settings, and its code serves up to twice that width for sharp screens. 600 px covers the largest setting. If you have an SVG logo and your theme accepts it, use it, because it stays sharp at any size.

For the favicon, upload a square image. Dawn's settings note says it is displayed at 32 x 32 px, so use a simple mark, not your full wordmark, which turns into an unreadable smudge at that size.

How to check the image sizes your own theme needs

Theme sizes change with layout settings, so it is worth checking your own store once. It takes about two minutes in Chrome or Edge on a desktop:

1. Open a product page on your live store.
2. Right-click the main product image and choose Inspect.
3. Hover over the highlighted img tag. The browser shows the displayed size, for example 715 x 715.
4. Double the larger number. That is the minimum width to upload for that slot.
5. Repeat on a collection page, the home page banner and a blog post.

Use the doubled number as a floor, then round up to the sizes in the cheat sheet. If you find any image shown wider than the file you uploaded, that slot is where blurry images come from.

Five image mistakes that slow a Shopify store down

Image size is about speed as much as sharpness. Shopify resizes images for each screen, but it can only work with what you upload. Watch for these five:

• Uploading straight from the camera. For example, a 6000 x 4000 px photo is 24 megapixels, over the 20 megapixel limit on Shopify's theme images page. Resize before upload.
• Text inside banner images. It cannot be read on mobile and search engines cannot read it at all.
• Mixed shapes in one grid. It makes the store look unfinished and pushes cards out of line.
• PNG for big photos. A photographic banner saved as PNG is usually much larger than the same image saved as a good JPEG.
• No alt text. Every product and collection image should describe what it shows, for example "Brown leather tote bag, front view".

Slow, inconsistent images are one of the usual reasons a store gets visits but few orders. Our guides to a Shopify store getting traffic but no sales and the product page checklist cover the other common causes. If you want to compare apps that compress images and fix alt text in bulk, see our comparison of SEO apps for Shopify.

FAQ

What size should images be for Shopify?

Use 2048 x 2048 px for product and collection images, 3000 px wide for banners and slideshows, 2200 x 1238 px for blog featured images and 600 px wide for the logo. Keep every file under 20 MB and 20 megapixels. These sizes come from doubling the widths that Shopify's Dawn theme displays, so images stay sharp on high-density screens.

What is the best image size for Shopify products?

2048 x 2048 px, square. Shopify's help center says this size usually displays best for square product images. In Dawn the main product image is shown at about 715 px wide, so a 2048 px file covers 2x screens and still leaves detail for the zoom view. Use the same square shape for every product so collection grids line up.

What is the Shopify banner size?

Upload banners at 3000 px wide. Dawn's banner and slideshow sections fill the full screen width and serve versions up to 3840 px. Height depends on the look you want: 3000 x 1200 px gives a short, wide banner, while 3000 x 1688 px is 16:9. Set a focal point so the subject stays in frame on mobile.

Does Shopify compress images automatically?

Shopify serves images through its CDN and, according to its help center, detects which formats each shopper's browser supports. Themes like Dawn also request smaller versions for smaller screens. It does not fix an oversized upload, though. Resize photos to the sizes above before uploading, and avoid saving large photos as PNG.

What image format is best for Shopify?

Shopify's help center says PNG is the best file type for most product images, followed by JPEG. Use PNG or SVG for logos and graphics with flat color or transparency. For large photographic banners, a high-quality JPEG is usually much smaller. Shopify also accepts WebP, GIF and HEIC uploads.

What size is the Shopify favicon?

Dawn displays the favicon at 32 x 32 px. Upload a square image of a simple mark, such as one letter or your icon, because a full logo is unreadable at that size. Set it under Theme settings, then Logo, in the theme editor.