Best Shopify Image Sizes for 2026: Product, Banner & More

If your Shopify website feels slow or your images appear blurry or stretched, you may be using incorrect image sizing. Power Reviews found that 60% of consumers always look for visual content before purchase, meaning that images can also affect the user experience and sales.

Optimizing your images requires knowing Shopify-specific dimensions and aspect ratios, in addition to best optimization practices. In this guide, I’ll cover the best Shopify image sizes and aspect ratios to help your store look professional and load faster.

Compress and resize oversized Shopify images automatically

Up to 98% compression rates

Speed boosting features

Try TinyIMG

Shopify image size recommendations: quick overview

Image sizes can depend on the theme you’re using, but Shopify states general guidelines and recommendations that you should follow:

• Maximum image size: 5000 x 5000 pixels (or 20 megapixels)
• Recommended square image size: 2048 x 2048 pixels
• Maximum image file size: up to 20 MB
• Image resolution: 72 dpi
• Image size for zoom functionality: 800 x 800 pixels
• Supported formats: JPEG, PNG, WebP, GIF, SVG, TIFF, BMP, PSD, HEIC

Best Shopify image sizes for different types

The best Shopify image sizes and aspect ratios depend on where the image will be placed and what theme you’re using. For example, product images are usually large and square, while logos are compact yet high quality.

Here’s a quick overview of the recommended Shopify image sizes for different purposes:

Note that some Shopify themes may have predefined dimensions for product or other types of images to fit the page design. In such cases, check the recommended theme image sizes to avoid cropping, page layout issues, or distorted visuals.

Now, let’s review the general image size recommendations for Shopify in more detail.

Product image size

Shopify product images can be up to 5000 x 5000 px, but Shopify recommends a 2048 x 2048 px size. The file size shouldn’t be over 20 MB.

Shopify also recommends using a 1:1 (square) aspect ratio. What’s important is that you maintain a similar aspect ratio for all product images to ensure consistency and structure.

• Recommended dimensions: 2048 x 2048 px
• Aspect ratio: 1:1
• File size: up to 20 MB

Hero image size

Shopify hero image size can be a maximum of 2500 x 900 px. The size Shopify recommends is 1280 x 720 px, and a file size of 10 MB.

Hero images are attention-grabbing images with text usually placed above-the-fold. They’re generally smaller in height than background images, with the best aspect ratio being 16:9.

• Recommended dimensions: 1280 x 720 px
• Aspect ratio: 16:9
• File size: no more than 20 MB

Shopify collection image sizes

Shopify collection image size can be up to 5000 x 5000 px. The file size shouldn’t exceed 20 MB. The recommended size is a square photo of 1024 x 1024 px, but it may vary depending on your theme.

Make sure that your collection images are always square (same width and height) and the same or similar size. Having the same dimension and ratios in images makes your site look more structured.

• Recommended dimensions: 1024 x 1024 px
• Aspect ratio: 16:9
• File size: no more than 20 MB

Shopify banner image size

Most Shopify professionals suggest 1200 x 400 px as the best Shopify website banner image size. However, banners can vary in size depending on where they’re placed and their purpose.

For example, for Google Ads banners, the platform provides its own optimal sizing guidelines for desktop and mobile:

If you’re using another ad platform, be sure to look for specific size recommendations to ensure proper display.

For other banner images that aren’t ads, Shopify recommends using rectangular sizes, like 970 x 90 or 300 x 200 px.

• Recommended dimensions: 1240 x 400 px, 970 x 90 px, 300 x 200 px
• Aspect ratio: 3:1, 3:2, 16:9, or platform specific
• File size: no more than 20 MB

Logo image size

The recommended Shopify logo image size is 100 x 100 px, with a 1:1 ratio. This is much smaller than Shopify’s 450 x 250 px limit and ensures the logo doesn’t become distorted anywhere on the website. Plus, logo file sizes that are too large can adversely impact page loading time.

Yet, just like with other images, logo size can also depend on your Shopify store theme. For example, the Turbo Shopify theme developers suggest using a 400 x 100 px logo image for the main menu, 100 x 50 px for mobile, and 250 x 200 px for the footer.

So, make sure you check your theme’s documentation to know what size is best for your website.

• Recommended dimensions: 100 x 100 px (square),  400 x 100 px (rectangular)
• Aspect ratio: 1:1 or 4:1
• File size: no more than 20 MB

Image with text overlay size

The recommended size for images with text overlay, like background, featured blog, or even some banner images, is around 1800 x 1000 px (a 9:5 ratio).

However, the size of images with text overlay highly depends on your chosen theme and specific image type, so make sure to refer to your theme recommendations.

• Recommended dimensions: 1800 x 1000 px
• Aspect ratio: 9:5
• File size: no more than 20 MB

Blog image size

The best Shopify blog image size is 1200 x 800 pixels (3:2 ratio). While the right size of a featured blog image depends on your theme, it should be universal across all of your blog posts.

Same as with other types of images, the size of a featured blog image cannot exceed 5000 x 5000 px and 20 MB in file size, or Shopify will downsize it for you.

• Recommended dimensions: 1200 x 800
• Aspect ratio: 3:2
• File size: no more than 20 MB

Shopify background image size

The recommended Shopify background image size is 2560 x 1400 pixels (16:9 ratio). This is a safe option that ensures your background works on any device. Plus, the size of your files shouldn’t exceed 10 MB to avoid performance issues.

The Shopify image size limits still apply, so you can’t exceed 5000 x 5000 px. Remember, smaller images load faster.

Keep in mind that background image sizes will differ depending on the theme. Therefore, it’s always a good idea to see what sizes are recommended by the developers.

• Recommended dimensions: 2560 x 1400 px
• Aspect ratio: 16:9
• File size: up to 10 MB

Other Shopify image sizes

There are also some other types of Shopify images that should also follow recommended size guidelines, such as favicons, social media sharing visuals, and more. Let’s cover the optimal sizing for each type.

Slideshow image size

Shopify slideshow images are landscape and should be between 1200-2000 x 400-600 px. The recommended aspect ratio is 3:1.

The precise aspect ratio will determine how much above-the-fold space there is for other elements of the page.

Mobile and desktop devices will crop slideshow images differently, so make sure:

• The subject of your shots is centered
• The details of your image are large enough to see on mobile
• The slideshow images are optimized for page speed

The more similar your images are, the better the overall design will be. Align all your slide pictures in size or at least ratio.

Each theme can also have special recommendations on what image sizes it suggests for the best look. Check with your theme developer for specific size guidelines.

Social sharing images

Shopify social sharing images recommended size is 1200 x 628 px. Yet, it depends on the social platform you’re sharing it on. For instance, while the recommended size is ideal for Facebook, the recommended size for Instagram Stories is 1080 x 1920 px.

The easiest way to find the right size is to check the free Shopify image resizer. It resizes images based on the social media channel and the place you need them for.

For social media icons on your website, Shopify recommends using square images – 32 x 32 px on desktop and 48 x 48 px on mobile.

Newsletter

The recommended size for the newsletter section image on Shopify is 1600 x 300 px. If you’re adding an image to a newsletter pop-up, you should go with a 425 x 575 px size.

However, it all depends on your theme. And if you’re creating a newsletter pop-up, the right size will depend on whether it’s a simple square one or a full-screen pop-up.

Favicon

The recommended size for a Shopify favicon is 16 x 16 px or 32 x 32 px (1:1 aspect ratio). It’s a small icon used in a browser’s tab or bookmark list.

If you add a favicon on Shopify that’s too large, the platform will automatically reduce it to 32 x 32 px. Keep in mind that you can’t upload this type of image if you’re using a Starter plan.

How to resize Shopify images?

If your images are too large to use on Shopify pages, you can easily resize them. You can either use an image optimization app on Shopify to automate oversized image resizing or simply resize images from the Shopify media editor.

Here’s how to resize images manually:

1. Open Shopify and go to Content > Files.
2. Locate the image you want to resize and click on it.
3. Under the “Resize” section, add the recommended image dimensions. Keep the padlock on if you wish to retain the original aspect ratio.
4. Press Apply and then Save.

If you don’t want to change dimensions, you can also try cropping the image under the “Crop and transform” section.

What are the best image formats to use?

Shopify supports a variety of image formats, but the best one to use depends on your needs. Here are the main image formats and which ones I recommend using:

• WebP – best format to use for collections, product images, banners, and blog images. It offers greater compression levels compared to JPG and PNG at a similar quality, so you can keep page load times high with smaller images. Shopify serves WebP images in browsers that support this format.
• JPG/ JPEG – great for lifestyle images and large visuals that need complexity and lots of colors. It offers a smaller file size than PNG but doesn’t support transparency. Note that JPG images use lossy compression, so overcompressing can cause quality loss.
• PNG – best for logos, icons, and graphics. PNG images support transparency and ensure textual clarity and sharp edges. The only downside of this image format is that the file sizes of complex images can be large due to lossless compression. Make sure to optimize images to maintain fast speeds.
• GIF – use sparingly for short animations or demos. The file sizes can get large quickly, which can affect your site’s performance.

Shopify accepts a number of other image formats, like SVG, TIFF, or HEIC, but they are not used as widely.

Why are image sizes important for your Shopify store?

Using proper image sizes is about ensuring an organized design, a better user experience with fast page load times, and better SEO.

When images are optimized across devices, it prevents blurry or stretched visuals, which could affect the user experience. For example, shoppers may not be able to visualize the product clearly or understand its specifications.

Proper image sizing is also an important practice of Shopify speed optimization. Larger images take longer to download, so speed tools like PageSpeed Insights will recommend reducing their size to ensure better load time.

The faster your pages load, the lower the bounce rates you can expect. For example, Google Developers found that speeding up the load time by 80% led to 43% lower bounce rates for the Economic Times.

Since the 2018 Google update, page speed has become a ranking factor on mobile. So, optimized images that contribute to better performance can also support your SEO efforts.

Image optimization tips for Shopify

When optimizing Shopify images, the most important part is that they’re unique and memorable. Unless you have a small budget, avoid stock images for commercial use, since they might end up being used on a number of other sites.

If you’re not confident in your design skills, look into professional poster designs with tailor-made templates for a high-quality solution.

But looks aren’t everything. Here are the main image optimization tips you should follow for Shopify visuals:

• Compress images to maintain smaller file sizes. You can use any free image compression tool online, which can help you reduce the JPG or PNG file size by 80% or even more without sacrificing quality.
• Select the right format for your images, like WebP for product images or PNG for logos, so you maintain small file sizes.
• Resize oversized images so they don’t break your store’s layout and negatively affect the shopping journey for your visitors.
• Use consistent aspect ratios, including for product images and collection images, so your store layout looks clean and organized. If you have too many photos and little editing skills, trust this process to experts providing product retouching services.
• Test image sizes on mobile devices to see if they don’t affect the layout. Follow the best practices for responsive images on Shopify.
• Enable lazy loading, which delays loading images until the user needs them. It helps improve the page load time.
• Show the product in use so your visitors can visualize how they can make use of the product in real life. Include images of real people wearing or using your product.
• A/B test your images to experiment with different types of images on your store and measure their impact on sales.

How do I know the image size on a web page?

There are various ways you can check the size of an image on a web page, like opening Shopify > Content > Files and clicking on the image to find its dimensions and file size under “Details.”

Alternatively, you can check it using the Inspect Element tool. Whichever browser you choose, the process is the same:

1. Open the web page and locate the image you want to check.
2. Right-click the image using your mouse and click “Inspect” or “Inspect Element” depending on your browser.
3. Once the Inspect tool opens, locate the size on top of the image or in the “width” and “height” in the highlighted line.

You may not see the image size above the image once the Inspect tool is open, depending on your browser. In such cases, you can still locate it in the Elements window.

Making an impression with the right Shopify images

Choosing the right Shopify image sizes may seem overwhelming. But what matters is that they don’t affect layout on your live store, are high quality, and have a small file size. It helps ensure that your pages are fast and your customers have a great shopping experience.

Make sure your images are under 5000 x 5000 px and no more than 20 MB. Keep the image resolution at 72 dpi for optimal web display and make sure to use the WebP format when possible for lower file sizes.

If dealing with image optimization seems to be taking too much time, you can try image optimization apps like TinyIMG. It automatically compresses your images daily and resizes oversized images to keep your store organized.

×

About the author

Kristina Jaruseviciute

Kristina is a Senior Writer at TinyIMG responsible for informing and educating readers on all things Shopify-related. In her writings, she covers a broad range of topics, from the best apps and themes for Shopify merchants to tips on how to optimize your website for SEO, performance, and higher conversion rates.