The reference desk for online sellers
Codes

Image Aspect Ratios Cheat Sheet for Stores

Merchants keep asking which crop ratio is correct, but the theme code shows the real question is which of a handful of preset ratios a given section even offers, and Dawn and Horizon do not offer the same ones.

Reference · October 8, 2026 · 6 min read · AI-drafted from sourced data

Most guides to image aspect ratio treat it as a design decision the merchant makes freely, picking 16:9 or 4:3 or square because it looks good. That gets the mechanism backwards. In a Shopify theme, the ratio a merchant can actually use is whatever the section’s schema allows, and the schema is a fixed list of select options written into the theme’s code, not an open field. Read Dawn’s and Horizon’s own section files and the picture changes: some sections give you a named image_ratio dropdown, others give you image_height or desktop_image_width instead, and the two families of themes do not name or count these settings the same way at all.

Dawn controls shape through height and width, not a ratio field

Dawn’s sections/image-banner.liquid, registered under the label t:sections.image-banner.name, carries 12 settings and 3 block types as read from the Shopify/dawn repository at commit 258f00f. Among its settings are image and image_2, both image pickers, image_overlay_opacity as a range from 0 to 100 in steps of 10%, image_height as a select with 4 variants, image_behavior as a select with 4 variants, and desktop_content_position as a select with 9 variants. Nowhere in that list is a setting named image_ratio. The shape of the banner is governed by image_height, a closed set of 4 choices, not a free ratio input.

Dawn’s sections/image-with-text.liquid, labeled t:sections.image-with-text.name, has 13 settings and 4 block types. It includes image as an image picker, height as a select with 4 variants, desktop_image_width as a select with 3 variants, layout as a select with 2 variants, image_behavior as a select with 3 variants, and content_layout as a select with 2 variants. Again, no field is named image_ratio in this section. A merchant asking “what aspect ratio should my image-with-text image be” is really asking which combination of height and desktop_image_width produces the crop they want, and there are only 4 times 3 combinations to try.

Horizon names the ratio directly, but only in some sections

Horizon takes a different approach in its content blocks. blocks/_blog-post-featured-image.liquid, labeled t:names.featured_image, has 15 settings including image_ratio as a select with 4 variants, width as a select with 3 variants, custom_width as a range from 0 to 100 in steps of 1%, width_mobile as a select with 3 variants, custom_width_mobile as a range from 0 to 100 in steps of 1%, and height as a select with 2 variants. blocks/_collection-image.liquid has 8 settings, also including image_ratio as a select with 4 variants, plus collection_image_width and collection_image_height, both ranges from 0 to 100 in steps of 1%, and padding-block-start and padding-block-end, both ranges from 0 to 50 in steps of 1px.

So in Horizon, the word “ratio” shows up explicitly in the two block files above, each offering 4 preset options, while Horizon’s own sections/hero.liquid, labeled t:names.hero, does not use that field name at all. Hero has grown to 36 settings and 8 block types as read from the Shopify/horizon repository at commit 8b42ace, and its image control runs through separate media slots instead: media_type_1 as a select with 2 variants choosing between image and video, paired with image_1 as an image picker and video_1 as a video field, then the same pattern repeated as media_type_2, image_2, and video_2. There is no image_ratio setting in hero.liquid as measured at that commit, so shape control there is a matter of which media slot and which image picker, not a ratio dropdown. sections/product-hotspots.liquid, with 15 settings and 1 block type, also skips image_ratio and instead exposes toggle_overlay as a checkbox, overlay_color, overlay_style as a select with 2 variants, gradient_direction as a select with 2 variants, and section_width as a select with 2 variants, none of which touch cropping directly.

What Shopify requires versus what a theme’s schema allows

The Theme Store requirements page, loaded September 9, 2026, lists an image size rule of 64 x 64px marked required, and a separate row for aspect ratio expressed as a numeral to numeral format, also marked required or recommended depending on context. That requirement governs what a developer submits to the Theme Store, not what dropdown a merchant sees inside an installed theme’s customizer. The actual choices available to a merchant come from the section schema, which is why the counts above matter more day to day than the submission rule.

SettingTheme fileTypeOptions
image_heightDawn image-banner.liquidselect4 variants
desktop_image_widthDawn image-with-text.liquidselect3 variants
image_ratioHorizon _blog-post-featured-image.liquidselect4 variants
image_ratioHorizon _collection-image.liquidselect4 variants
media_type_1 / media_type_2Horizon hero.liquidselect2 variants each

Market context for anyone shopping around

Across the aggregate market ranking of 329 themes tracked on themescout.co, in a snapshot dated August 26, 2026 — the aggregator has returned the same figures on every check since, so this is an August reading, not a live one — the median theme price is $300 with a range of $100 to $500, and the average rating sits at 4.53 out of 5 across 308 rated themes, with a median of 23 reviews per theme. None of that says anything about image settings specifically, but it is useful context if a merchant is comparing a $300 median-priced theme against something cheaper and wondering what else differs. Field performance is a separate question again: mobile pass rates for all Core Web Vitals have a median of 84.8% across 249 themes with sufficient CrUX data for August 2026, ranging from 43.8% to 97.2%, and desktop pass rates have a median of 86.2% across 202 themes, ranging from 28.6% to 98.6%. This is real visitor data, not a lab run, so it reflects actual devices and actual connections loading actual images.

Number of settings per section across Dawn and Horizon010203040Dawn image-banner12Dawn image-with-text13Horizon hero36Horizon product-hotspots15Horizon featured-image15Horizon collection-image8Method: read from each theme’s own schema files in the Shopify/dawn and Shopify/horizon repositories, commits 258f00f and 8b42ace, September 9 2026

What to actually do

Open the theme’s own section files or its customizer panel before choosing an image, find whether the section exposes image_ratio directly or only height and width selects, and crop the source image to match whichever closed set of options that section actually offers. If Core Web Vitals matter to the store, treat the 84.8% mobile and 86.2% desktop medians as a baseline to beat, not a target, since the best themes in the market clear 97.2% and 98.6%.

Frequently asked questions

Does Shopify require a specific image aspect ratio for theme submission?

The Theme Store requirements page lists an image size rule of 64 x 64px as required, alongside a separate row for aspect ratio expressed as numeral to numeral. This is a submission bar for theme developers, not a rule a merchant applies to every banner image. It tells you the platform checks minimum pixel dimensions and a ratio format, not that every section forces one fixed ratio. Store owners choosing images for an existing theme should look at the section's own settings instead, since those settings decide what ratio actually gets applied on the page.

Which theme sections let me pick an image aspect ratio directly?

Horizon's blocks/_blog-post-featured-image.liquid has an image_ratio setting with 4 options, and blocks/_collection-image.liquid has the same image_ratio setting with 4 options. Dawn's image-banner.liquid and image-with-text.liquid do not expose a setting literally named image_ratio, they instead use image_height, a select with 4 variants, and desktop_image_width, a select with 3 variants, to control proportions indirectly. So the naming and the mechanism differ between the two themes even when the goal is the same.

Can I control how the image behaves on scroll or hover, not just its shape?

Yes, in both themes, through a setting called image_behavior. Dawn's image-banner.liquid offers image_behavior as a select with 4 variants, and image-with-text.liquid offers it with 3 variants. Horizon does not list image_behavior among the fields extracted from hero.liquid or product-hotspots.liquid, so any scroll or hover motion on those sections would have to come from a different setting not captured here.

Is there a setting called Image Aspect Ratios Cheat Sheet for Stores in any theme?

No. Across the categories tracked, which include Art, Auto, Bags, Beauty, Clothing, Electronics, Food and drink, Home, Jewelry & Access., Kids, Pets, Sports, and Toys, no setting or section carries that phrase. It is a search term, not a schema field, so this article treats it as a request for a guide rather than a literal lookup.

Do bad image settings actually hurt Core Web Vitals scores?

The field data does not isolate image settings as a single cause, but it does show a wide spread worth knowing. On mobile, the median share of real visitors passing all Core Web Vitals is 84.8% across 249 themes with sufficient data, with the best theme at 97.2% and the worst at 43.8%. On desktop the median is 86.2% across 202 themes, best at 98.6%, worst at 28.6%. Image height and width settings that force layout shift or load oversized files are one plausible contributor to a low score, but the CrUX numbers cover the whole page, not a single section.

Sources & data

  1. Shopify Theme Store requirements page, image size and aspect ratio rules (checked September 9, 2026)
  2. Shopify/dawn repository, sections/image-banner.liquid and image-with-text.liquid schema at commit 258f00f (checked September 9, 2026)
  3. Shopify/horizon repository, sections/hero.liquid, sections/product-hotspots.liquid, blocks/_blog-post-featured-image.liquid, blocks/_collection-image.liquid at commit 8b42ace (checked September 9, 2026)
  4. themescout.co aggregate theme market ranking, 329 themes (checked September 9, 2026)
Cite this report: Ecom Almanac Research Desk (2026). “Image Aspect Ratios Cheat Sheet for Stores.” Ecom Almanac. https://ecomalmanac.com/codes/image-aspect-ratios-cheat-sheet-for-stores/
Figures on this page are our own measurements. You may quote them and reproduce a single table or chart, provided you include a visible, followable link to this page. Full terms: Reuse & citation.