Text size on product images is decided by a number almost nobody checks: the size of the tile the buyer actually sees. Not your 1600 px export — the fingernail-sized square in the search grid. Retailers are advised to render product tiles on smartphones at roughly 16 x 16 mm. That is the canvas your dimension label is really printed on.
Six beliefs keep sellers designing for the wrong canvas. Each one has a published counter-argument, because grocery brands solved this problem years ago and wrote the rules down.
A note on where these rules come from: the Mobile Ready Hero Image work was driven by FMCG brands and retailers, so the examples are shampoo bottles and dog food. The physics is not category-specific. A shopper squinting at a 16 mm tile cannot read your sofa's seat depth any better than they can read a laundry pack's wash count.
Myth 1: buyers will zoom in if they need the size
They will — after they click. The click happens in the grid, where zoom does not exist yet.
That sequencing is the entire argument. Every zoom-based defence of small text assumes an engaged shopper who has already chosen your listing over the eleven others on screen. If your image lost that comparison because the buyer could not tell what size the item was, the zoom feature never gets used. Legibility is a top-of-funnel problem disguised as a detail-page problem.
Myth 2: 1600 px means the text is readable
Pixels are storage, not size. What determines readability is the rendered size on the physical screen, and that number is far smaller than sellers assume.
The Mobile Ready Hero Image guidance asks retailers to display image tiles at approximately these rendered sizes:
| Device | Recommended rendered tile size | Roughly |
|---|---|---|
| Smartphone | 16 x 16 mm | A fingernail |
| Tablet | 23 x 23 mm | A postage stamp |
| Desktop or laptop | 50 x 50 mm | A credit card's short side |
The guidance is explicit about why it does not simply say "make them bigger": larger tiles compromise the shopper's ability to scroll a listing page quickly, while smaller tiles make it impossible to communicate anything graphically, which pushes shoppers back to reading product titles — slower and more cumbersome than scanning images.
So the constraint is fixed. You are designing for 16 mm whether you like it or not, and a 1600 px file rendered into 16 mm is downscaled by roughly two orders of magnitude before anyone reads it. Text size on product images has to be specified against that rendered tile, not against the canvas in your editor. Getting the frame right matters too — see product image aspect ratio for what happens when the platform crops the side your dimensions were on.
Myth 3: strong contrast makes small text fine
Contrast and size are two independent ways to fail, and fixing one does not rescue the other.
The published targets for e-commerce image text are specific. The Accessible Perceptual Contrast Algorithm score should usually be above 60, with 45 as a bare minimum, and the GS1 hero image guideline points to the W3C minimum contrast ratio of 4.5:1 as the accessibility floor. The colour combination also has to work for shoppers with colour vision deficiency, which rules out several pairings that look high-contrast to you.
Contrast is necessary. It is not sufficient. Text that is too small at 16 mm stays unreadable at any contrast ratio, because the failure is angular resolution, not luminance.
Myth 4: a thin, elegant typeface looks premium
It looks premium at 100%. At 16 mm, inside a JPEG, it disappears.
The guidance on typeface is unusually direct for a standards document:
| Choice | What the guidance says |
|---|---|
| Font weight | Semi-bold or bold usually gives the best legibility — avoid ultra light and extra bold |
| Font style | Sans serif faces such as Open Sans or Arial; avoid decorative, stylised or serif fonts, which display poorly in a small image, especially because retailers typically use the .jpg format |
| Background behind text | Keep it clean — avoid colour gradients, avoid text over patterned backgrounds |
| Effects | Avoid outline and drop shadow text effects |
Note that extra bold is on the avoid list too. Very heavy weights fill in their own counters when downscaled, and a filled-in 8 reads as a 0. For a dimension label, that is not a cosmetic problem — it is a wrong number.
Myth 5: more callouts means more information
The canvas is small and every element competes for it. Anything on the image that is not carrying a message the buyer needs is taking space away from the ones that are.
The hero image standard is ruthless about this. It defines four critical messages, the 4Ws — Who (the brand), What (the product type), Which (the variant), and HoW much (the net content) — and treats everything else as a candidate for deletion. Its automated-compliance rules go further: the only element permitted off the pack is a single black square size lozenge in the bottom right corner. No floating text, no other off-pack assets, nothing breaking the pack boundaries, white background. It also states that multiple views of the same product should not be shown, because they are visually disruptive and can mislead a shopper about how many items they receive.
Translate that to a spec diagram and the priority is uncomfortable but clear: one dimension a buyer can read beats six they cannot. Deciding which labels earn their space is the harder half of the job — product photo callouts covers how to choose them.
Myth 6: where you put the size does not matter
It does, and the reason is not aesthetic.
The guidance places off-pack size information in the bottom right corner, and gives two reasons. First, consistency: when every image in the category puts size in the same place, the shopper knows where to look without hunting. Second, geometry — the bottom right is the only location compatible with both portrait and landscape product shapes. Anywhere else works for one orientation and collides with the product in the other.
If you have ever nudged a dimension label three times because it clashed with a tall SKU, that is the rule you were rediscovering the hard way.
The 16 mm test: run it in 60 seconds
You do not need a research budget to know whether your image passes. There are two ways to check.
The physical version. Print the image at 16 x 16 mm and hold it at 40 cm — normal phone viewing distance. Anything you cannot read is not there.
The digital version. The GS1 guideline specifies the simulation directly: apply a Gaussian blur with a radius of 34 pixels to a 3000 x 3000 pixel image. That blur level is calibrated to represent viewing on a mobile device held 40 cm away. Evaluate the blurred image on your monitor. If a dimension is illegible after the blur, it is illegible to a large share of real shoppers.
There is a licensed tool built for this — Clari-Fi, from the same University of Cambridge group, at £263 plus VAT for a single-user licence — and large brands use it as a gate rather than a review. Unilever's global e-commerce director stated in October 2022 that every new or updated e-commerce image must pass the Clari-Fi check before it is sent to retailers, and that the company had run more than 30,000 product images through it in three years. For a small seller the manual blur is a fair substitute. What matters is running the check at all, before the image ships, not after the returns arrive.
The consequences are quantified, which is rare in this field. An image that fails the AA-level clarity check means over 46% of shoppers cannot perceive the critical information inside it. In the guidance's own worked example, a conventional pack shot failed on "which variety" and "how much," with the share of people likely to have difficulty perceiving those messages falling in the range of 52% to 100%.
That is the nail: if your dimension label fails the blur test, you did not publish a dimension. You published a decoration.
For context on what an unread dimension is worth, a wrong-size return costs the outbound shipping, the return shipping, the inspection, the repack and often the margin on the whole unit — the return cost calculator puts a per-unit figure on it.
Text size on product images: what survives the tile
| Element | Treatment that survives 16 mm | What kills it |
|---|---|---|
| Dimension numbers | Largest text on the image; semi-bold sans serif; one unit system per image | Numerals sized to match caption text |
| Units (cm, in, mm) | Same weight as the numeral, never a superscript | Small-caps or superscript units that blur into the digit |
| Dimension lines and arrows | Stroke thick enough to survive downscaling; solid, high-contrast | Hairline 1 px strokes that vanish |
| Leader lines to a callout | Short, straight, no crossings | Long thin leaders across a busy photo |
| Size lozenge | Solid block, bottom right, consistent across the range | Floating text with no background |
| Background under text | Flat, clean area of the image | Gradients, patterns, product texture |
| Secondary marketing text | Removed, or moved to image 2 | Anything competing with the number that sells the fit |
Two rules cover most of it. The dimension is the biggest text on the image or it is not the point of the image. And every element that is not one of your critical messages is borrowing space from one that is.
FAQ
How big should text be on product images?
Big enough to survive the 16 mm tile — text size on product images is a test result, not a fixed pixel value. Because the rendered size depends on the image's pixel dimensions and the screen's density, a single "use 48 px" answer is wrong on half the devices. Set your text, blur the export at the calibrated level, and size up until the critical numbers stay readable.
Will buyers zoom in to read the dimensions?
Some will, after they click. The problem is that the click is decided in the search grid, before any zoom is available, so text that only works when zoomed contributes nothing to whether a shopper picks your listing.
What contrast do I need for text on a product image?
Aim for an APCA score above 60, treat 45 as the floor, and keep the classic 4.5:1 contrast ratio as an accessibility baseline. Check the pairing against colour vision deficiency as well — a red number on a green background can hit the ratio and still be invisible to a meaningful share of shoppers.
Can I put the size in the corner of the image?
Yes, and the bottom right corner is the recommended position. It is the only corner that works for both portrait and landscape products, and putting it in the same place on every image lets shoppers find it without searching.
My spec diagram fails the blur test — what is the fastest way to fix it?
Do not reshoot. The photo is usually fine; the annotation layer is the problem. The fast path is to keep dimensions as a live, editable layer bound to the measured edges of the product rather than flattened into the JPEG, so you can enlarge the type, thicken the lines, drop the decorative labels and re-export at each platform's image spec in one pass. That capability — measuring against the real geometry and re-exporting on demand — is what separates annotation software from a photo editor, and from an image generator that produces a confident-looking number it never measured. If you are choosing between approaches, the roundup of tools to add dimensions to product photos compares them on exactly that point.
Sources & References
- GS1 — Mobile Ready Hero Images Guideline: the 4Ws, the calibrated Gaussian blur check (34 px radius on a 3000 x 3000 image, 40 cm viewing distance) and the 4.5:1 contrast reference
- GS1 — Mobile Ready Hero Images (current standard landing page)
- University of Cambridge Inclusive Design Toolkit — Recommended size for text and numerals within Mobile Ready Hero Images: APCA targets, font weight and style guidance, and the 46% figure
- Inclusive Design Toolkit — Displaying images on mobiles at the best possible size: 16 x 16 mm smartphone, 23 x 23 mm tablet, 50 x 50 mm desktop
- Inclusive Design Toolkit — Visual clarity test: how blurring simulates thumbnail viewing, and the AA check level
- Inclusive Design Toolkit — Evidence of hero image benefits: the worked pack-shot example and the 52-100% difficulty range
- Inclusive Design Toolkit — Presenting size information: bottom right positioning for off-pack size lozenges
- W3C — Understanding WCAG Success Criterion 1.4.5 Images of Text