Recommended image sizes
Recommended image sizes for Kingdom: slideshows, collection grids and the product gallery, and how to avoid cropping important parts of an image.
Applies to: Kingdom 6.2.0 and later. Added in: Kingdom 2.0.0. Last checked: 2026-10-13 against Kingdom 6.2.0.
This page lists the image sizes that work best in Kingdom, and the settings that decide how much of an image is cropped.
Where to find it: the image settings of each section, and Theme settings → Product card → Media aspect ratio for product grids.
Slideshows and full-width sections
For the Slideshow: vertical and Slideshow: horizontal sections, use images of 1920 x 1040 px.
For the fullwidth sections (like the slideshow or "cropped" product images) a level of cropping is required in order for the images to display as fullwidth on any screen size. Please use the recommended image sizes to minimize the cropping and also avoid using important image content (like text for example) on the edges.
- Screens have different shapes, so a full-screen image is always cropped on some of them: at the sides on tall screens, at the top and bottom on wide ones.
- Use the mobile image settings of the slideshow sections to upload a separate, taller image for phones.
Collection and product grids
Product images in grids follow Theme settings → Product card → Media aspect ratio. There is no single recommended size: test the options with your own images.
- Natural never crops. Each image keeps its own shape, so upload all product images at the same size, or the grid looks uneven.
- Short (4:3), Square (1:1), Tall (5:6) and Taller (2:3) crop every image to the same shape. Choose the one closest to your photos, so the least is cropped.
The small product images in the cart, the search drawer and the hotspot tooltips use Theme settings → Cart → Aspect ratio instead.
Product page gallery
- Use the Scroll gallery style for square or landscape images, and Slider only for portrait images.
- If slider images are too large and too much is cropped, turn on Scale slider images to fit the viewport.
Both settings are in Products → Default product → Product page → Media. See Product page.
Other image sizes in the theme editor
| Image | Size |
|---|---|
| Favicon | 48 x 48 px PNG |
| Popup image | 1240 x 400 px, shown on desktop only |
| Collection banner image | 16:9 aspect ratio |
| Sidebar logo on mobile | a wide image, shown at a maximum height of 40 px |
| Custom social icon | 72 x 72 px transparent PNG |
| Custom payment icons in the footer | 38 x 24 px or the same proportions |
Why are my slideshow images cropped?
Because a full-width slideshow fills the whole screen, and the screen rarely has the same shape as your image. Kingdom crops the image to fill the slide. Use images of 1920 x 1040 px, keep important content away from the edges, and add a separate mobile image.
Why do my product cards have different heights?
Because Media aspect ratio is set to Natural and your product images have different shapes. Either resize all product images to the same size, or choose a cropped ratio, such as Square (1:1), in Theme settings → Product card.
Related pages
- Slideshow: horizontal section: slides and mobile images.
- Slideshow: vertical section: full-screen vertical slides.
- Product card theme settings: Media aspect ratio.
- Product page: the gallery settings.
- Optimize images and improve SEO: compress images before upload.
Kingdom video guide
The Kingdom setup video: a short introduction to the theme editor, the sidebar and the main sections, with a text summary of what it covers.
Shopify basics for Kingdom stores
Shopify topics that are not Kingdom settings: menus, metafields, apps, translations and theme updates, with links to the Shopify Basics pages.