The Complete Shopify Image Size Guide For E-Commerce Owners

We don’t know about you, but if we see low-quality, blurry product images on an e-commerce store? We’re exiting that page like it’s on fire. And 75% of online shoppers agree with us. The same goes for pictures that aren’t aligned properly.

This is why it’s important to get your image quality, size, and format right — to enhance the customer experience (and also to make your pages load faster). And, hey, it helps with site SEO, too. 

Here’s a complete guide on the recommended Shopify image sizes to use!

Basic guidelines for Shopify image sizes

The Shopify image size depends on a few things: the purpose of the image, your Shopify theme, and the platform’s image limits.

Here’s what Shopify recommends:

• Maximum image dimensions: 4472 x 4472 pixels (or 20 megapixels)
• Recommended dimensions for square images: 2048 x 2048 pixels
• Minimum image size if you want to enable zooming: 800 x 800 pixels
• Maximum image size: 20 MB
• Image resolution: 72 dpi

Shopify automatically compresses your photos (i.e. reduces their size) to make your store faster to load. It also automatically crops images to fit the viewers’ screen size. You can also use an image compressor to reduce the size of the photos without compromising on its quality.

To make sure that the subject of your image is always visible, add a focal point to your photos! You can do this by placing the blue dot over the part of the picture you want to highlight.

Shopify image size recommendations

Image type	Recommended dimensions (in pixels)	Aspect ratio
Product image	2048 x 2048	1:1
Banner image	1920 x 1080	16:9
Collection images	1024 x 1024	1:1
Slideshow image	2000 x 600	3:1
Background image	2560 x 1400	16:9
Logo	100 x 100 (or) 400 x 100	1:1 (or) 4:1
Blog image	1200 x 800	3:2
Image with text (for featured blog images)	1800 x 1000	1.8:1
Hero image	1280 x 720	16:9
Favicon	32 x 32	1:1
Newsletter	600 x 200	3:1

We didn’t include social media image size guidelines here because that varies depending on the platform.

Let’s look at a few of the main image types that you’ll be using on your Shopify store in detail below.

1. Product image size

Product images should typically be square with a minimum size of 800 x 800 pixels (although, sometimes, rectangular images with an aspect ratio of 3:1 is acceptable — it all depends on your products!) This makes sure that your images don’t get pixelated and blurry when your buyers zoom in. 

Maximum image size: 4472 x 4472 pixels
Maximum file size: 3 MB (so that you don’t bog down your store with too many large-sized images, slowing its load time)

2. Background and hero image sizes

Your store’s background image is the first thing that people’s eyes land on, so make sure that it isn’t too large (or small)! The ideal Shopify background image size is 2560 x 1400 pixels (or) 1920 x 1080 pixels with an aspect ratio of 16:9. 

Hero images are similar to background images, except they’re shorter and only take up half of the screen. The ideal size for hero images is 1280 x 720 pixels with an aspect ratio of 16:9.

Shopify automatically resizes your background and hero image to fit different screens, so prioritize image clarity and make sure it’s optimized for the largest screen!

Maximum file size for background and hero images: 10 MB

3. Collection images size

Collection images are the photos that let your customers know what the collections are all about. These should be square (ideally, 1024 x 1024 pixels) with an aspect ratio of 1:1. 

For consistency, make sure that all of your collection images are the same size. This also makes them look good (and uniform) on a mobile phone where they will be displayed one on top of the other!

Maximum image size: 4472 x 4472 pixels
Maximum file size: 20 MB

4. Slideshow images size

Ever seen websites where the hero images keep rotating between a few different photos? These are known as slideshow images. You should make sure that all of your slideshow images are the same size and have the same aspect ratios.

The recommended image size for slideshow images is between 1200-2000 x 400-600 pixels with a 16:9 aspect ratio. Since slideshow images are front-and-center, you can use each image to highlight a different product. If you have a flagship item, you can include a different benefit on each slide.

Maximum image size: 4472 x 4472 pixels
Maximum file size: 20 MB

5. Logo sizes

Logos are typically small, but they appear everywhere on your Shopify website. So, you’re going to want to keep the size small to make sure that it doesn’t take up too much space and slow your website down (because all of the logo’s appearances put together will add up pretty quickly). 

The ideal image size for square logos is 200 x 200 pixels (or) 100 x 100 pixels with an aspect ratio of 1:1. For rectangular logos, use the recommended size of 400 x 100 pixels with a 4:1 aspect ratio.

Here’s a square logo with a 140 x 140 pixels image size:

Maximum image size: 450 x 250 pixels
Maximum file size: 1 MB (but make sure it is as small as possible)

6. Blog image size

Your blog image sizes depend on the Shopify theme you’re using, where you’re placing them, and the amount of screen size you want them to take up. 

Featured images: These are the photos that appear as thumbnails (along with your blog title) when people view your blog at a glance. The best size for a featured blog image is 1800 x 1000 pixels with a 1.8:1 aspect ratio. Make sure it doesn’t exceed 2240 x 1260 pixels and 3 MB in size. 

Images within your blog post: While these depend on your theme, the ideal size is 1200 x 800 with an aspect ratio of 3:2.

7. Favicon

A favicon is the tiny icon you see near the website name on your browser tab and bookmarks list. It’s the smallest image you’ll use!

A favicon should be 32 x 32 pixels (or) 16 x 16 pixels with a 1:1 aspect ratio. Keep in mind that you can’t upload a favicon to your store if you’re on the Shopify Starter plan.

Best image formats for Shopify

While Shopify supports various image formats — such as JPEG, PNG, GIF, HEIC, and WebP — it recommends the following formats in particular. 

• JPEG format: Best for images that have a large (and bright) color palette and need to visually pop, such as product images, banners, slideshows, and blog images
• PNG format: Best for images that are flat and don’t need to be very colorful, such as logos and icons
• GIF format: For animated or moving images

Tips for optimizing images for Shopify

Here are some tips you should follow before you upload your images to Shopify:

• Edit your images: Whether you want to lightly touch up your images or meme-ify them using a face changer for social media, use an image editor to get the job done. (Psst… Crosslist comes with its very own advanced image editor. And, hey, we support Shopify, too!)
• Check image sizes: Double-check that all the images are within the recommended size limits. Shopify has its own image resizer, too, which can help you save space. 
• Use relevant file names and add alt text: Instead of using gibberish names such as “plaiuwjbczh” for your image files, use something descriptive like “shopname-shopify-banner-image.” Not only will this help you identify your images quickly, it also helps with optimizing your store for SEO. Don’t forget to add image alt texts, too. 

And, above all, don’t forget to use high-quality images that reflect your e-commerce store’s brand! 

---