Blurry Hero Image, Mobile and Desktop Sizes

Store Design
1

Hi ,

I am using the Evolve theme, and I have questions on the hero image. At the suggested size 1400x800, if I export at 72 dpi, it is extremely blurry. If I export at 300 dpi, the image is good quality. If checked the Shopify CDN, and seems Shopify is automatically reducing the resolution on the CDN to 72 dpi, even if I have 300 dpi. I create multiple sizes based on the width of the screen (1200, 1000, 800, etc)

Second thing I am noticing is the image gets chopped from the width in mobile. On the desktop, it get chopped height wise.

My questions are:

  1. Is there are way to keep the dpi at 300 or more than 72?

  2. Is there a way to avoid the image getting chopped, and what is the aspect ratio I should be using to prevent it from getting chopped on mobile and desktop

  3. Can I specify two images - one for desktop and another for mobile?

I can send the original and the chopped images if someone wants to look at. Appreciate your help.

Thanks,

Rajesh

2

@karmaspices

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.