Why Do Product Images Look Blurry on Your PrestaShop Store?

A crisp product photo on your desktop can easily lose its edge the moment it hits your PrestaShop storefront. Most blurry product images aren't caused by bad uploads, but by PrestaShop automatically resizing photos to low-resolution presets.

PrestaShop generates every display image from your back-office settings, which often scale down quality and force browsers to stretch small files. By tweaking your registered image sizes and compression rules, you can quickly restore sharp, high-converting product visuals.

The Real Culprit: PrestaShop Resizes on Upload, Not On Display

A sharp photo on your desktop can still look soft the moment it lands on a product page.

Blurry PrestaShop product images are almost always caused by an Image Type being registered at too small a size, low JPEG quality, or an aggressive compression pass, not by the original upload. PrestaShop generates every on-page size from your Image Settings, so you fix the size and quality, then regenerate thumbnails.

Before going further, our own PrestaShop Product Images by Customers is worth a look if your storefront relies on buyer photos as well as catalogue shots. It lets customers upload images on the product page, gives you configurable upload settings (maximum image size, format and so on) and an attractive photo slider, and the same sizing and quality rules in this guide apply to those uploads too.

PrestaShop works with two separate files for the same product. The file you upload into the Images tab is the original, stored once and left alone. Every image your customer sees on the category page, the product page, the cart and the thumbnail strip is a copy the shop generated itself.

Those copies come from the sizes listed under Design > Image Settings in the section headed Image Types. Each entry (cart_default, home_default, large_default and so on) is a registered width and height. When you save a product image, PrestaShop cuts a new file at each of those dimensions and saves it under /img/p/.

So the original may be a crisp studio shot, while the box on your homepage is pulled from a tiny thumbnail stretched across a banner. That stretch is the blur. The pipeline:

• You upload the original into the product record.
• PrestaShop reads every active Image Type from Image Settings.
• It writes one generated file per type into the /img/p/ folder tree.
• Your theme requests a specific type by name, for example home_default or large_default.
• The browser receives that file at exactly the size PrestaShop cut it, and scales it if the CSS box is larger.

Once you know this, the fix stops being mysterious. You are not repairing a broken upload; you are correcting the recipe PrestaShop used to bake the copies, then asking it to bake them again.

Which Culprit is It? A 4-step Diagnostic Ladder

Four checks narrow almost every blurry product image to a single cause, runnable in about ten minutes without touching a live setting. Work through them in order and stop as soon as one fails.

1. Measure the Image Actually Served. Open the product page, right-click the blurry image and choose "Open image in new tab" or "Inspect". The address ends in something like -home_default or -large_default plus the extension. Note the suffix (that is the image type at work), then check the pixel dimensions. A product shot displayed at 600px wide but served at 220px is being downsized and stretched back up, which is exactly what blur looks like.
2. Check the Registered Image Type. In the back office, go to Design > Image Settings and read the width and height for the type you spotted. If that number is smaller than the space the image occupies on your theme, nothing downstream can rescue the sharpness. This is the most common cause, and it points you to the Image Types fix.
3. Look at the JPEG Quality Value. The same page holds a quality field for JPEG output. A low value smears fine detail, especially on fabric textures, packaging text and jewellery close-ups. If dimensions look correct but the image still looks soft or blocky, compression is your culprit, and you can jump to the quality fix.
4. Confirm Whether Thumbnails Were Ever Regenerated. If you changed an Image Type after products were uploaded, PrestaShop keeps serving the old files until you rebuild them. Compare a recently uploaded product with an older one: if the new arrival is sharp and the veteran is fuzzy, regeneration is the missing step.

Once you have a failing step, go to the matching section: Image Types for step two, JPEG quality for step three, and Regenerate Thumbnails for step four. If all four pass, the cause is upstream of the original file, which the retouching and source-image sections cover.

Fixing Image Type sizes in Design > Image Settings

In PrestaShop 1.7 and later, image formats are managed under Design > Image Settings in the Back Office. This is where every registered format gets its pixel dimensions, and where you correct the root cause: the size PrestaShop writes into the resized file during upload.

Open the page, and you will see a table of every registered image type. The ones that matter most on product pages:

• home_default: product thumbnails on the home page and many category listings.
• medium_default: the default image shown on the product page itself.
• large_default: the enlarged image behind the zoom or the thumbnail switcher.
• small_default: cart blocks, cross-sells and mini product rows.
• category_default: category cover images.

Each row exposes a width and height in pixels and a setting for whether to crop to those dimensions. Adjust the values and save. If a theme adds its own image types, they appear in this same table and are edited the same way.

Choosing Sensible Pixel Widths

The medium_default value decides whether the main product image looks sharp. If a theme displays that image inside a 600px column, a format registered at 250px wide will always look soft, no matter what you do to the original file.

For a typical product page on a modern theme, these are reasonable starting points. Treat them as a guide, and check the actual rendered width in your browser before committing.

On high-density phone and laptop screens, a 2x width stops the image from looking slightly soft. Doubling the registered width costs a little more file size, so keep the compression setting sensible at the same time.

Once saved, new uploads use the new dimensions. Existing images do not change until regenerated, which is why editing this table alone can leave old products looking exactly as blurry as before.

Worth checking before you touch the sizes: which format your theme actually prints on the product page. A theme that swaps medium_default for large_default in the template means resizing the wrong row changes nothing visible. If your catalogue runs across several languages and each locale shows different product photos, the PrestaShop Multi-Language Product Images module keeps those language-specific images assigned correctly while the image types stay consistent.

Why Your JPEG Quality Setting Quietly Blurs Everything

Even when every Image Type is registered at the right dimensions, PrestaShop re-encodes your product photos as JPEG by default, and the quality slider governing that re-encoding sits on the same page as your size settings. Drop it too low and PrestaShop throws away fine detail to shave a few kilobytes off each file. The resize itself is faithful; the compression afterwards softens edges, smears text on labels and turns thin lines into mush.

Open Design > Image Settings and read the JPEG quality field on your own install (defaults vary by version). Values in the low range produce visibly muddy thumbnails, especially on the small product-list images shoppers scan first. Push it higher, and the difference on a zoomed product shot is obvious.

A sensible starting point for a store selling detailed goods (jewellery, printed artwork, clothing with textures):

• Keep the quality value comfortably high, close to the top of the scale, and compare the file size trade-off on a few hero products first.
• Judge the result on the generated thumbnail, not the original uploaded file, since that is what actually renders.
• Re-save your source photos at high quality in an editor before uploading, so PrestaShop is not compressing an already-compressed image.

Blur that survives a correct Image Type size is almost always the JPEG quality slider, not the resize.

If your PrestaShop version and server support WebP, enabling it as the output format sidesteps much of this compromise: WebP holds sharper detail at smaller file sizes than JPEG. Confirm your server's image library (GD or Imagick) can write WebP before switching, and test a product page in a browser that supports it. 

How Do You Regenerate Thumbnails in PrestaShop?

Go to Design > Image Settings in the back office and scroll to the Regenerate Thumbnails section at the bottom. Tick the image types you want to rebuild, choose whether to keep existing files, then click Regenerate Thumbnails. This applies any new Image Type sizes and JPEG quality you have just saved.

Old thumbnails persist until you do this because PrestaShop keeps every generated size on disk. Editing a type only changes the recipe for future uploads, so an existing product image keeps its blurry copy until the regeneration job overwrites it.

A sensible approach:

1. Fix the Image Type sizes first, so you only regenerate once.
2. Select the types that appear on the product page (typically large_defaultmedium_default and home_default).
3. Leave the option to keep existing images unticked if you want a clean rebuild from the originals.
4. Run the job, then hard-refresh a product page to confirm the new files load.

Expect the process to take a while on a large catalogue, because PrestaShop is resizing the original for every selected type. It can push CPU load on shared hosting, so run it during a quiet period rather than at peak traffic. Regenerating thumbnails is the single step that turns saved settings into sharper on-page images.

If you change sizes again later, the originals are safe and untouched, so you can repeat this regeneration as often as needed without losing source quality. On stores that sell into several languages, verify the right images show per store view once the job finishes, and the PrestaShop Multi-Language Product Images module helps keep those assignments organised.

Retina, CSS Containers and Cache: The Blur Causes Nobody Checks

You have sized your Image Types correctly, raised JPEG quality and regenerated thumbnails. The product page still looks soft. At this point, the original file and the generated types are usually both fine, and the blur is being introduced somewhere between PrestaShop's output and the customer's screen.

These secondary causes are easy to miss because nothing in the Back Office flags them. Each one either stretches a correctly sized image beyond its pixel dimensions or serves an old file that no longer matches your settings.

CSS Boxes Wider Than the Generated Type

PrestaShop outputs an image at the dimensions of the Image Type you assigned to that spot. Your theme's stylesheet then decides how big it appears. If the product grid uses a type registered at, say, 250px but the CSS stretches the container to 400px, the browser upscales a file with no spare pixels. It looks slightly soft on a laptop and noticeably mushy on a high-density display.

Identification is quick: right-click the image, choose Inspect, and compare the rendered size with the file's intrinsic width. A rendered width well above the natural width confirms the stretch. The fix is either a larger registered Image Type assigned in the theme, or a CSS rule that caps the image at its true size.

High-density Screens Amplify Every Small Shortcut

Retina and other high-DPI displays pack more physical pixels into each CSS pixel. An image filling a 300px box may need a 600px file to look sharp. Store owners often check a page on an ordinary monitor, declare it fixed, then get complaints from customers on modern phones and laptops.

• Test the product page on an actual phone or a high-DPI laptop, not only on a desktop monitor.
• If the theme supports a retina or 2x image type, register it at roughly double the display size and assign it where the theme expects it.
• Keep the original upload generous. A sharp 2x derivative can only come from an original with enough detail.

Stale Caches Serving Old Thumbnails

PrestaShop keeps generated thumbnails in the image cache on disk. Your browser and any caching layer in front of the site keep their own copies too. Change the Image Type size or quality and regenerate, and the new files may be correct on the server while visitors still receive the old, smaller version from a cache. The symptom is classic: the blur "fixes itself" for you after a hard refresh but not for customers.

Clear the PrestaShop cache under Advanced Parameters > Performance, purge your browser cache and flush any page cache or CDN you run. Then confirm the image URL returns the new dimensions.

CDN and Optimiser Modules Re-Compressing Your Work

Modules and services that optimise images often re-encode files at their own quality level, or serve a WebP replacement you never inspected. What you fixed in PrestaShop's settings can be undone downstream. If quality changed after you installed such a module, disable it temporarily and reload the product page to see whether the sharpness returns. Some also cache aggressively, so purge them before judging the result.

Portrait and Landscape Crops Fighting Your Uploads

PrestaShop's Image Types can crop to fixed proportions. Upload a tall bottle shot and a wide type may crop the top and bottom, while a panoramic type crops the sides. The image can then appear softer or awkwardly framed because the theme is displaying a heavily cropped version rather than the shape you intended. Check whether each type crops or keeps proportions, and match the original's aspect ratio to the slot it will fill. If you sell in several languages and swap images per language, the PrestaShop Multi-Language Product Images module keeps each language's visuals organised, so you are not juggling mismatched crops by hand. 

If the file's pixel width matches its rendered width, the blur is in the file; if it does not, the blur is downstream in CSS, retina handling or a cache.

Recommended Image Settings for Sharp PrestaShop Product Photos

The fastest way to stop blur coming back is to set a baseline before the next upload. You do not need to memorise every PrestaShop field. You need a source image big enough to feed your largest Image Type, and a quality setting that does not crush detail. Work through the table below, then run the checklist.

Run this short checklist before every bulk upload:

• Confirm each Image Type width matches or sits below the size it is displayed at.
• Check that your JPEG quality number is high, not tuned for file size.
• Keep WebP as the primary format with a JPEG fallback for older browsers.
• Leave one genuinely large Image Type in place for zoom.
• Regenerate thumbnails after changing any of the above.

If you sell work where customers judge quality from the photo, image handling is part of the storefront. PrestaShop Product Images by Customers lets shoppers upload their own product photos, and clear upload limits keep those newer, smaller customer images within the same sharp baseline. 

Treat your largest Image Type as the floor, not the ceiling, and the rest of the sizes will always have detail to spare.

PrestaShop Blurry Images: Quick Answers

Product photos that look soft in PrestaShop almost never come from the camera file itself. The store registers one original upload, then builds each on-page size from your Image Types settings, so the blur is usually created inside PrestaShop. Short answers to the questions support teams get asked most often:

• Why Does The Thumbnail Look Worse Than The Zoomed Image? The product page uses a separate thumbnail image type. If that type is registered as small and the theme stretches it, the browser enlarges a tiny file and softness appears.
• Will CSS Fix It? No. CSS can scale an image up but cannot add detail. The cure is a bigger registered size for that type, followed by a thumbnail regeneration.
• How Do I Know Which Image Type Is at Fault? Right-click the blurry image, choose "Open image in new tab", and check the pixel width in the address bar or by saving the file. Compare that figure with the CSS container width on the page.
• Do I Need To Re-upload Every Photo? Usually not. Re-uploading is only required when the original file itself is lower resolution than the size you are trying to display.
• Is JPEG Quality A Culprit On Its Own? Yes. Very strong compression produces blocky, mushy detail even when the size is correct, so check quality alongside dimensions.
• Can A Third-party Module Cause This? Occasionally. Modules that resample or lazy-load images can soften them. Disable them one at a time to test.

If your stores accept customer photos alongside catalogue shots, the same rules apply to those uploads, which is where PrestaShop Product Images by Customers fits in: it lets shoppers submit product photos, so plan your upload size limits with the settings earlier in this guide in mind.

Symptoms of Blurry PrestaShop Product Images

PrestaShop blurry images rarely affect every photo the same way. That inconsistency is a useful clue: it tells you the problem sits somewhere between the original file and the size PrestaShop serves on the page.

Before you touch a single setting, confirm you are dealing with a resizing problem rather than a genuinely low-quality source image. These are the patterns store owners report most often.

• The image looks sharp on the product page but soft or fuzzy in the category listing.
• Images look fine when you open the original file, yet the version on your site is visibly pixelated.
• Only some products are affected, usually the ones uploaded months or years ago.
• Product photos look crisp on a desktop monitor but blurry on a phone or a high-density screen.
• Zooming the product page reveals a small image being stretched to fill a larger frame.
• Recently uploaded photos are sharp, while older catalogue shots are not.
• Text on packaging or product labels is unreadable in thumbnails.
• After switching themes, the same photos suddenly look worse.
• Colours look fine, but edges and fine detail are mushy, a classic sign of heavy JPEG compression.

What Causes This Problem?

Here is the root cause most guides skip. PrestaShop stores your uploaded original once, then generates every on-page size from your Image Types configuration. The browser almost never shows you the original. It shows a resized version, only as sharp as the width and quality settings allow.

That single mechanic explains nearly every case of blurry PrestaShop images. The table below maps each cause to how hard it is to fix.

Quick Fixes

Work through these in order. Most stores find their answer in the first three steps, which take a few minutes each.

1. Open the product in the back office and confirm the original uploaded image is genuinely high resolution.
2. Go to Design > Image Settings and check the width registered for each image type your theme uses.
3. On the same screen, raise the JPEG quality value a step or two and save.
4. Clear the PrestaShop cache from Advanced Parameters > Performance.
5. Regenerate thumbnails from Design > Image Settings so the new sizes and quality take effect.
6. Hard-refresh the product page in your browser to bypass your local cache.
7. Compare the same product in a private browsing window to rule out stale assets.
8. View the category page and product page separately, since they often use different image types.

Conclusion

Fixing blurry PrestaShop product images comes down to correcting the backend recipe, not re-uploading your catalogue. By adjusting your Image Type dimensions, raising JPEG quality, and regenerating your thumbnails, you ensure your site displays the crisp, professional photos your products deserve.