Hi when I try to upload my images to my store they get pixelated and blurry this also happens on the product pictures, Anyone know how to fix this?
Store url: https://watworkwear.com
Topic summary
Core Issue:
Shopify’s automatic image compression is causing uploaded images to appear pixelated and blurry, particularly affecting artists and designers selling visual products. Users report that even optimized images (100-150KB JPEGs at 85% quality) still suffer from aggressive compression.
Official Guidance (Limited Success):
- Export as JPEG instead of PNG
- Optimize images to 100-150KB at 85% quality
- Shopify won’t further compress images already optimized to 85%
However, multiple users confirm this approach doesn’t resolve the problem in 2024.
Working Solutions:
-
SVG Upload Method (Most Popular):
- Upload images as SVG files to preserve original quality
- Note: Figma exports may require removing specific code rows (
<pattern>tags and</defs>) for proper mobile display
-
Image Size Selection:
- Double-click uploaded images in the backend editor
- Select “Original size” from formatting options instead of default compressed versions
-
Code Modification:
- Add
img_url: 'master'parameter to image div code to bypass compression - Example:
<img src="{{ section.settings.image | img_url: 'master' }}">
- Add
Ongoing Frustration:
Users express significant dissatisfaction with Shopify’s lack of user control over compression settings, calling it outdated for 2024 internet speeds.
Hey @Zetterman ,
To keep load times fast, Shopify automatically compresses images when they’re displayed on your online store. Compressing an image means reducing the file size to allow for faster page loading. I have a few tips that should help you to export clearer images:
- If your images are PNG, I suggest exporting in JPEG (same quality for smaller Kb size)
- Your hero images are quite small (30-50Kb), at that file size they are never going to be great quality so you need to up it to around 100-150Kb (if your source images are all high quality then they are probably much bigger than this, so you’ll need to optimize them down to an appropriate size).
- If you optimize them to 85% as a JPEG then Shopify won’t optimize them further, so you should get the results you are expecting.
- There is an article here that goes into more depth about automatic image compression and format selection.
As a side note, I love the work you’ve done on your website so far. Certain products like the Wat Hoodie stand out to me because of the great job you’ve done with the product images and description. Have you thought about who your target customer is for your website? Our blog post on Building a Buyer Persona talks about narrowing down who your ideal customer is. This process is good to go through so that you can get the most out of your marketing.
Let me know if I can clarify anything further!
Tried it - doesn’t work actually - tired all kinds of variations on this - larger size images etc. Shopify image compression is way too agressive and makes my whole site look really bad. I have a squarespace site as well and images on that always look amazing. I think it would be wise for Shopify to address this and make the sitewide compression less aggressive - or remove and leave it to their customers. As an artist it really kills the look and feel or my work. Having it automatically applied like this is overkill and seems like an outdated practice considering most people are on fast connections nowadays - even on phones. Please fix!!
10 Likes
I totally agree with @anchorball .
The site I am doing right now has the same problem. As example the image in the product detail page is not distorted from compression as much as the image that links to the product. All while both images are loaded up from the inventory on the backend (so no 2 different images of the same but only one)
There had to be a way to adjust this setting.
3 Likes
this is NOT an accepted solution. I’ve reduced a 800KB image down to 230KB and it’s STILL being turned into sludge. This isn’t acceptable. it’s 2024, nobody has potato internet, and if they do they’re not my target audience.
3 Likes
So well said. Same boat. It is such a pity to put so much effort into crafting beautiful images to sell your art to have Shopify sh*t on them by forcing really redundant image compressing. It’s 2024 not 2015.
Please Shopify let us dictate our site image resolution!!
4 Likes
Hi Moira,
I am having an issue with Shopify force compressing my images which result in product photos that are a blurry pixelated mess.
I’ve followed image best practice (I’m an illustrator/designer so optimising images for 15yrs+)
I’ve created my file 2048px 144res, on the left you can see the quality in Photoshop, on the right is when I upload it to Shopify. It’s woefully poor quality. Other images have also been affected, banding in gradients where none exist in original file because Shopify has compressed aggressively.
As someone who is selling their ART I need the images to be top quality. This is not an acceptable level of resolution.
Can you please find a solution for this?
1 Like
Ok Shopify has even compressed THAT FILE into a blurry mess. There is a huge distinction in quality between both. Until I upload it of course.
What do we have to do to get decent images??
Have you found a solution to this? I’ve been looking everywhere I cannot figure out a way around this.
2 Likes
I’m also looking for the same solution
Hi all. I just found this thread because I was experiencing the exact same issue. The solution mentioned previously didn’t help (surprise, surprise). However, I figured it out!
Download your image as a SVG file and upload it to your store. The quality will remain the exact same as your original artwork. Hope this helps!
2 Likes
Download your image as a SVG file and upload it to your store. The quality will remain the exact same as your original artwork. Hope this helps!
5 Likes
Exactly, it’s the same image? This is what was confusing me.
It looks fine on Product page but is blurred beyond belief on Collection page!
How is this acceptable?? How do others using Shopify successfully navigate this?
I literally can’t show my collection page (which hosts all the art prints like a gallery) because of this..
For the monthly fee we pay is disgraceful.
1 Like
Nope. I contacted Shopify support but gave up. I don’t understand as mentioned above it’s the same image uploaded, it looks fine in one instance and is blurred in another. I’ve had to redesign my site to avoid a collection overview. Frustrating.
THIS WORKED!!!
You absolute genius !! 
I can’t believe it I thought I was doomed to low res images 
Thank you so much!
3 Likes
See solution that WORKS below! : D
Upload as an SVG and the resolution issue is resolved 
update: See solution that WORKS below! : D
Upload as an SVG and the resolution issue is resolved
No problem!! Glad we have a solution to this problem!
2 Likes
It’s just shameful this happens in 2024. Reckless image compression for the sake of file size. It would be nice if the user had some control over it, I know I’ve put in an awful lot of time to create the absolute best images for my store, only for them to end up compressed by Shopify. Please fix this asap!
2 Likes
