Shopify size chart generator
Last updated
One click lays out a chart below and opens the size guide widget. The measurements in it are ours, not a sizing standard, so replace them with your own in step 2.
Pick one of the three charts above. Your table, in both units, appears here, followed by the size guide widget it is meant for.
What goes into the chart
A Shopify size chart is a table on the product page that matches each size label to body or garment measurements, and this generator lays out your own figures, converts them between centimetres and inches, and flags cells that will not convert before you build the chart as a size guide widget.
No sizing standard is built in. Sizes differ between brands and between countries, so every figure in the chart comes from you, and the only thing the generator adds is the unit translation. The widget it is meant for is in the store widget gallery, and the size guide help article shows each step in the app.
The measurements are yours; the generator only arranges them and translates the units. These are the parts that shape the finished table.
- Rows and columns
- One row per size, up to 12, and up to 6 measurement columns such as chest, waist, hips or inseam. The size label always leads the row, so every figure is read against it.
- Typed unit
- The unit you entered the figures in. It shows first and stays exact; the other unit is a rounded translation of it.
- Unit switch
- With both units on, the table above lets you flip between centimetres and inches to read it the way a shopper would. Inches are rounded to one decimal place and centimetres to whole numbers.
- Ranges and text
- A single number or a range such as 86-90 converts. Anything else, such as S/M or One size, stays as written in both units, and the generator counts those cells so none slips past.
- Fit note
- One line under the table that says whether the figures are body or garment measurements and how the style runs. The generator flags a chart that has none.
- Pop-up guide or inline table
- The two layouts of the size guide widget. The pop-up guide opens from a button near the size choice; the inline table prints the chart on the page. The preview lets you try both.
Nudgesmart adds widgets like this one to your store from the theme editor, in your theme’s fonts and colours by default, and is available on the Shopify App Store. See every widget layout or see what it costs.
Four charts, and how each one converts
Invented garments. The cells converted, the ones left as text and every flag come from the same function the generator runs.
| Scenario | First size, both units | What the generator says |
|---|---|---|
| Womens tops typed in cm, shown with a switch | XS: 80-84 / 62-66 / 86-90 cm → 31.5–33.1 / 24.4–26 / 33.9–35.4 in | Nothing to flag |
| Mens jeans typed in inches, no fit note | 30: 30 / 32 in → 76 / 81 cm | No note under the table. Say whether these are body or garment measurements, and how the style fits. |
| Letter sizes in the cells | S/M: 55-57 / Most cm → 21.7–22.4 / Most in | 2 cells are not a plain number or range, so they show the same in both units. Use numbers such as 86 or 86-90 if the switch should convert them. No note under the table. Say whether these are body or garment measurements, and how the style fits. |
| Sizes but no measurement columns | — | Name at least one measurement column, such as Chest or Waist. |
What a size table cannot settle
Body size and garment size are different tables
A chart of body measurements tells shoppers which size to pick. A chart of the garment laid flat tells them how it will fit. State which one yours is in the fit note, or shoppers will read it the wrong way round.
Rounded conversions are for choosing, not for sewing
The translated unit is rounded so it reads cleanly. If a precise figure matters, such as an inseam for hemming, type the chart in the unit most of your customers use.
One chart rarely fits a whole catalogue
Tops, trousers and shoes are measured differently. Build each chart separately here, then make one size guide per chart in the app and choose which products each one shows on.
The preview shows a sample chart
The widget under your table is the app widget with sample sizes, so you can judge layout, style and colours. Your own rows are entered in the app, where the grid takes the same sizes and columns you set out here.
Fit words still matter
A table cannot say that a style runs small or is cut loose. A short line such as size up if between sizes answers the question most size charts leave open.
Size chart questions
How do I add a size chart to a Shopify product page?
Install Nudgesmart, open Store Widgets, choose Create Widget and pick the size guide. Type the columns and one row per size, as you set them out here, then publish it. Add to store opens your theme editor with the block already added to the product page, so you place it and save.
Can shoppers switch between centimetres and inches?
Yes. The size guide widget can show a centimetre and inch switch, and the table on this page shows what each of your figures becomes in the other unit before you enter them in the app.
How do I show different charts for different products?
Make one size guide per chart in the app, then use its Show on products setting to match collections, tags or product types. The size guide help article covers each setting.
Should the chart open from a button or sit in the page?
In the page it is seen without a tap, which suits products where fit decides the sale. Behind a button it keeps the page short. Either way, keep it next to the size choice, where the question comes up.
Does the preview use my measurements?
No. It is the app widget with sample sizes, so you can try both layouts, the styles and the colours. Your own chart goes in once you create the widget in the app.
Is anything sent to Nudgesmart when I use this?
No. The table is built in your browser and nothing you type is stored or sent.
Fit questions are settled on the product page or not at all.
Nudgesmart has a size guide widget, inline on the page or as a sheet that opens from it, and it uses your theme’s fonts and colours by default.
