PRODUCT IMAGE SPECS CHEAT SHEET
Updated October 2025
IDEAL DIMENSIONS:
• Square: 1000 x 1000 pixels
• Square: 1000 x 1000 pixels
IDEAL RESOLUTION:
• Does not matter (72-300 DPI)
• Does not matter (72-300 DPI)
IDEAL FILE FORMAT:
• WebP, saved at 80 quality
• WebP, saved at 80 quality
INTRODUCTION
This resource defines the ideal size and format of product images for most website design projects.
While there are occasional exceptions, this guide serves as a universal rule of thumb for achieving professional, high-quality visuals with fast load times.
This cheat sheet focuses specifically on standard product images, not banners, lifestyle shots, or other types of media.
Examples below illustrate each recommendation.
While there are occasional exceptions, this guide serves as a universal rule of thumb for achieving professional, high-quality visuals with fast load times.
This cheat sheet focuses specifically on standard product images, not banners, lifestyle shots, or other types of media.
Examples below illustrate each recommendation.
DIRECT COMPARISON
Below is a visual example of the same product shot exported under different settings.
The original image is directly from the digital camera with no resizing or optimization. The ideal export is resized and saved as a WebP (80 quality), resulting in reduced dimensions and dramatically improving file efficiency without visible loss.
Click each image to view full size.
The original image is directly from the digital camera with no resizing or optimization. The ideal export is resized and saved as a WebP (80 quality), resulting in reduced dimensions and dramatically improving file efficiency without visible loss.
Click each image to view full size.
ORIGINAL IMAGE
• 3376 x 3376 px
• 350 DPI
• JPG at max (12) quality
• 3.59 MB (≈3,771,080 bytes)
• 110× larger (≈10,870 % larger) than ideal
• 3376 x 3376 px
• 350 DPI
• JPG at max (12) quality
• 3.59 MB (≈3,771,080 bytes)
• 110× larger (≈10,870 % larger) than ideal
IDEAL IMAGE
• 1000 x 1000 px
• 150 DPI
• WebP at 80 quality
• 34.4 KB (≈35,226 bytes)
• 99% reduction in file size from original
• 1000 x 1000 px
• 150 DPI
• WebP at 80 quality
• 34.4 KB (≈35,226 bytes)
• 99% reduction in file size from original
IMPROPERLY SAVED AS PNG
• 1000 x 1000 px
• 150 DPI
• PNG
• 1.04 MB (≈1,090,569 bytes)
• 29x (≈2,920%) larger than ideal
• 1000 x 1000 px
• 150 DPI
• PNG
• 1.04 MB (≈1,090,569 bytes)
• 29x (≈2,920%) larger than ideal
IMPROPERLY SAVED AS JPG
• 1000 x 1000 px
• 150 DPI
• JPG at max (12) quality
• 550 KB (≈563,744 bytes)
• 15x (≈1,530%) larger than ideal
• 1000 x 1000 px
• 150 DPI
• JPG at max (12) quality
• 550 KB (≈563,744 bytes)
• 15x (≈1,530%) larger than ideal
WHY 1000 x 1000 PIXELS?
Images around 1000 px on the longest side are large enough for crisp detail but small enough to load instantly on all devices.
Larger files (e.g. 3000-4000 px) offer no visible improvement on modern screens, only slower load times and heavier uploads.
For higher resolution needs (like zoomed detail or retina displays), export a @2x version (2000 × 2000 px) as an alternate asset.
Always export from the original image, not a resized copy, to preserve clarity.
Larger files (e.g. 3000-4000 px) offer no visible improvement on modern screens, only slower load times and heavier uploads.
For higher resolution needs (like zoomed detail or retina displays), export a @2x version (2000 × 2000 px) as an alternate asset.
Always export from the original image, not a resized copy, to preserve clarity.
WHY DPI DOESN'T MATTER
DPI (dots per inch) only applies to printing, not device screens. It is used to describe how many ink dots are printed per inch of paper. Web browsers ignore DPI entirely and display images based on pixel count, not dots per inch.
Exporting at 150 DPI is simply a balanced habit. It keeps images reasonably reusable for light print or mockups. Whether an image is saved at 72, 150, or 300 DPI, if its pixel dimensions are the same, the on-screen result and file size are identical.
In short, DPI affects how big an image prints, not how sharp it looks online.
Exporting at 150 DPI is simply a balanced habit. It keeps images reasonably reusable for light print or mockups. Whether an image is saved at 72, 150, or 300 DPI, if its pixel dimensions are the same, the on-screen result and file size are identical.
In short, DPI affects how big an image prints, not how sharp it looks online.
WHY WEBP?
WebP is the modern standard for web images.
It produces small file sizes, loads quickly, and maintains the same visual quality as larger JPEG or PNG files. It supports transparency, exports easily from most design tools, and works seamlessly across browsers and platforms including Shopify, Webflow, and Wordpress.
AVIF can create slightly smaller files with smoother gradients, but its support across major platforms is still limited. For now, WebP is the most reliable and professional format for all product imagery. It delivers the best balance of quality, compatibility, and performance.
It produces small file sizes, loads quickly, and maintains the same visual quality as larger JPEG or PNG files. It supports transparency, exports easily from most design tools, and works seamlessly across browsers and platforms including Shopify, Webflow, and Wordpress.
AVIF can create slightly smaller files with smoother gradients, but its support across major platforms is still limited. For now, WebP is the most reliable and professional format for all product imagery. It delivers the best balance of quality, compatibility, and performance.
FINAL THOUGHTS
Maintaining clean, optimized image specs improves both performance and presentation.
Smaller files mean faster-loading pages, better SEO, smoother backend handling, and cleaner galleries.
• 1000 × 1000 px minimum
• WebP (80 quality)
• File size under 500 KB
Bigger is not better. File size discipline is what separates amateur websites from professional ones.
Smaller files mean faster-loading pages, better SEO, smoother backend handling, and cleaner galleries.
• 1000 × 1000 px minimum
• WebP (80 quality)
• File size under 500 KB
Bigger is not better. File size discipline is what separates amateur websites from professional ones.
