Shopify

Shopify banner size

Shopify banner sizes depend on your theme, but most hero and slideshow sections look best between 1920 and 2000 px wide. Wide banners are cropped on phones, so keep the subject centered.

Add your product photos

Drag photos here, or choose them from your device.

JPG, PNG, WebP · Up to 100 photos · 25 MB each

Processed in your browser. Your photos are never uploaded.

Shopify image sizes

UseSize (px)Aspect ratio
Hero banner (16:9)Recommended1920 × 108016:9
Slideshow banner2000 × 8005:2
Announcement banner1200 × 4003:1

Sizes are practical starting points based on each platform's published guidance. Platforms change their rules, so confirm current requirements in their seller help center before publishing.

There is no single Shopify banner size

Shopify does not set one banner size for every store. Each theme decides how hero images, slideshows, and image banners are displayed, and many themes let you choose the section height, such as small, medium, large, or adapt to image. That is why the sizes on this page are practical starting points rather than fixed rules.

For most themes, a hero or image banner between 1920 and 2000 px wide stays sharp on large desktop screens. A 16:9 image (1920 × 1080 px) suits tall hero sections, while a wider 2000 × 800 px image suits slideshows and shorter banners. Announcement or promotional strips are often around 1200 × 400 px.

How themes crop banners on phones

A wide banner shown on a phone is either scaled down until it is very short, or cropped to a taller shape so it still fills the screen. Which one happens depends on the theme and section settings. In both cases, the left and right edges are the parts most likely to disappear, so put products, faces, and text near the centre.

Some themes, including Dawn, let you upload a separate image for mobile. If yours does, export a second, taller version from the same photo, for example a 4:5 or square crop, so the mobile banner is framed on purpose instead of cropped automatically.

Text on banners

Most Shopify themes let you add a heading and button on top of a banner using the theme editor. Using that text instead of writing words into the image keeps them sharp on every screen, makes them readable by search engines and screen readers, and lets you change a sale message without editing the image again.

If you do overlay text in the theme, choose a photo with a calm area of colour where the text will sit, and use the theme's overlay or opacity setting to keep enough contrast.

Keeping banners fast

The banner is usually the largest image on the home page and one of the first things to load, so its file size affects how quickly the page appears. Export photographic banners as JPG at 80–90% quality. A well-prepared 1920 px banner is usually a few hundred kilobytes, which is far lighter than an untouched camera original.

Tips for Shopify photos

  • Check your theme's image settings; some crop banners to fit the screen.
  • Avoid putting text near the edges of a wide banner.
  • Export JPG to keep large banners lightweight.

Questions about Shopify images

What size should a Shopify banner be?

It depends on the theme. 1920 × 1080 px works for most hero sections, and 2000 × 800 px for slideshows.

Why is my Shopify banner cut off on mobile?

Themes crop wide images to fit narrow screens. Keep the important part in the center.

Resize for other platforms