A photo looks blurry when its file is smaller than the place it fills on the screen. It looks cropped when its shape differs from the shape of that place, because Checkmate fills most places edge to edge and cuts off what doesn't fit. Both depend on the image you upload and on a few settings.
This is the most likely cause of a blurry photo. Shopify never makes an image file larger than the one you uploaded, so a small file is stretched to fill a large place and looks soft, most of all on high-resolution screens such as a recent laptop or phone. You can recognize this cause when the same photo looks sharp in a small place, such as a thumbnail, and soft in a large one, such as a hero.
Upload a larger version of the photo. Image sizes lists the width each place needs to look sharp.
The product page crops to a fixed shape
On the default product page, the Media block shows each photo in a fixed shape and crops the rest: a square in the Checkmate style, and an upright rectangle in the Lair and Fang styles. You can recognize this cause when tall or wide product photos lose their top and bottom, or their sides.
At the top of the editor, select Products, then Default product.
In the Product information section, select the Media block.
Under Image ratio, select Natural. Each photo then keeps its own shape.
Click Save.
Landscape, Square and Portrait crop every photo to that shape, which keeps the gallery even.
Product cards crop to the card's shape
Product cards show every photo in the shape set in Theme settings > Product cards > Image ratio: Portrait (4:5), Tall (3:4), Square (1:1) or Landscape (4:3). With Image fit set to Crop to fill, a photo of another shape loses its edges, and the card keeps the middle of the photo. You can recognize this cause when a photo is whole on the product page and cut on its card. Select Show whole image to fit the whole photo inside the card, with empty space at its sides or above and below it. Product card settings describes both.
Collection cards crop the same way, to a circle or to the Image ratio in Theme settings > Collection cards.
A section photo fills the section
A background photo, such as the one in a hero, always fills its whole section and is cut to the section's shape. The shape changes with the screen, so a wide photo loses its sides on a phone. You can recognize this cause when the photo looks right on a computer and cut off on a phone.
In the Hero section, choose a second photo in Mobile image for small screens. It shows on screens narrower than 768 pixels. The setting appears when Background type is Image and a Background image is chosen.
If you set a focal point on the image in Shopify, Checkmate keeps that point in view when it crops a section photo. Choose the subject of the photo as its focal point. Product cards ignore the focal point.
Other sections that show photos in a fixed shape, such as Blog posts, Comparison, Highlights, Hotspots and Featured product, have their own Image ratio setting.
Contact support
If an image still looks wrong, write to us through Contact support and include:
A photo looks blurry when its file is smaller than the place it fills on the screen. It looks cropped when its shape differs from the shape of that place, because Checkmate fills most places edge to edge and cuts off what doesn't fit. Both depend on the image you upload and on a few settings.
Rule out the cache and the wrong theme
If your other recent changes don't show on your store either, start with My changes don't show on my store. Images on checkout and in emails come from your Shopify settings. What the theme controls and what Shopify controls explains the difference.
The image file is too small
This is the most likely cause of a blurry photo. Shopify never makes an image file larger than the one you uploaded, so a small file is stretched to fill a large place and looks soft, most of all on high-resolution screens such as a recent laptop or phone. You can recognize this cause when the same photo looks sharp in a small place, such as a thumbnail, and soft in a large one, such as a hero.
Upload a larger version of the photo. Image sizes lists the width each place needs to look sharp.
The product page crops to a fixed shape
On the default product page, the Media block shows each photo in a fixed shape and crops the rest: a square in the Checkmate style, and an upright rectangle in the Lair and Fang styles. You can recognize this cause when tall or wide product photos lose their top and bottom, or their sides.
In your Shopify admin, go to Online Store.
Next to Checkmate, click Edit theme.
At the top of the editor, select Products, then Default product.
In the Product information section, select the Media block.
Under Image ratio, select Natural. Each photo then keeps its own shape.
Click Save.
Landscape, Square and Portrait crop every photo to that shape, which keeps the gallery even.
Product cards crop to the card's shape
Product cards show every photo in the shape set in Theme settings > Product cards > Image ratio: Portrait (4:5), Tall (3:4), Square (1:1) or Landscape (4:3). With Image fit set to Crop to fill, a photo of another shape loses its edges, and the card keeps the middle of the photo. You can recognize this cause when a photo is whole on the product page and cut on its card. Select Show whole image to fit the whole photo inside the card, with empty space at its sides or above and below it. Product card settings describes both.
Collection cards crop the same way, to a circle or to the Image ratio in Theme settings > Collection cards.
A section photo fills the section
A background photo, such as the one in a hero, always fills its whole section and is cut to the section's shape. The shape changes with the screen, so a wide photo loses its sides on a phone. You can recognize this cause when the photo looks right on a computer and cut off on a phone.
In the Hero section, choose a second photo in Mobile image for small screens. It shows on screens narrower than 768 pixels. The setting appears when Background type is Image and a Background image is chosen.
If you set a focal point on the image in Shopify, Checkmate keeps that point in view when it crops a section photo. Choose the subject of the photo as its focal point. Product cards ignore the focal point.
Other sections that show photos in a fixed shape, such as Blog posts, Comparison, Highlights, Hotspots and Featured product, have their own Image ratio setting.
Contact support
If an image still looks wrong, write to us through Contact support and include:
Your Checkmate version. Find your theme version shows where it is.
A preview link to the theme.
The URL of the page with the image, and the image file.
A screenshot of the image on the screen where it looks wrong.