You can put a 3D model next to the product photos in your Shopify store. Customers turn the product with a finger, zoom in, and on a phone they can even see it in their own room. You do not need a separate app for this: Shopify accepts a 3D model as product media, just like a photo or a video.
In this article we explain how to add a 3D model to Shopify, how the file should be prepared, how the AR view works on phones, and what you need when you want colour or material options to change on the 3D model itself.
Shopify supports 3D models out of the box
In Shopify you can upload a 3D model file to a product's media the same way you upload a photo. The supported formats are GLB and USDZ. According to Shopify's help pages, the limit is 500 MB per file, and files larger than 15 MB are optimised automatically on upload. Shopify also generates the USDZ version needed on iPhone from the GLB you upload.
If your store's theme supports 3D media, the model appears in the product gallery among the photos. Most of Shopify's current themes support it. When customers touch the model, they can rotate and zoom the product.
Step by step: adding a 3D model to a product page
- Prepare the model: The product's 3D model should be a GLB file, at real-world scale and optimised for the web. Details in the next section.
- Open the product: In the Shopify admin, go to Products and open the product.
- Add it to media: Drag the GLB file into the media area. Shopify processes the file and creates a preview image.
- Set the order: If you move the 3D model to the first position, customers see the product in 3D at first glance. Placing it second or third among the photos is also a common choice.
- Check on a phone: Open the product page on a phone, rotate the model and try the AR button.
How should the 3D model file be prepared?
Shopify's 500 MB limit is generous, but a fast product page needs far less. Shopify's own model preparation guide recommends around 4 MB for most products. For a customer on a phone with mobile data, that difference decides everything.
- Real-world scale: The model must match the product's dimensions exactly. Only then does a lamp on a table or a sofa in a room appear at the right size in the AR view.
- Light geometry: Parts hidden inside the product are removed. The edges and lines of visible surfaces are kept.
- Realistic materials: The texture of fabric, the sheen of metal and the clarity of glass come from the materials and textures inside the GLB. Textures are compressed to a resolution suited to the web.
- Correct orientation and origin: The product should stand upright and sit on the ground. A model exported in the wrong orientation appears lying on its side in the gallery.
If the product has a CAD file, the model is prepared from it; if not, it is modelled from technical drawings or from photos and dimensions. We explain this process in our article on 3D product modeling.
AR on phones: seeing the product in your own room
For products with a 3D model, customers on a phone can place the product in their own surroundings with the camera. On iPhone Apple's own AR viewer opens, on Android Google's; no app download is needed. For furniture, lighting, decoration and large household items, this answers "will it fit in my living room, will the colour match" before the purchase.
For AR to work, the model must be at real-world scale. A model with the wrong dimensions misleads the customer; a correctly sized one removes one of the reasons for returns.
The limit: colours and options do not change on the model
Shopify's built-in 3D viewer shows a single model. If your product comes in five colours, the 3D model does not change colour when the customer picks a variant; you need to upload a separate model for each colour. For products where several options combine, such as fabric, legs, lid or print, that means dozens of separate files and is not practical.
If you want customers to try options on the 3D model, a 3D product configurator is placed on the product page. The configurator defines every colour and material on a single model, and the product changes instantly as the customer chooses.
A 3D configurator on a Shopify product page
The configurator is added to the theme's product page as a section. Customers rotate the product and choose its colour and material; add to cart and checkout stay in Shopify's own flow. The selection in the configurator can be matched to Shopify's variant selection: when a customer picks "walnut wood, grey fabric" on the 3D model, the right variant goes into the cart.
To see what such a presentation looks like, take a look at the furniture example in our 3D Web App. The chair's fabric, wood and legs change, and when you pick your brand colour the product and the interface switch to it. We integrate the same system into your Shopify store with your product and your options. See our 3D web design and product configurator page for details.
Which route is right for you?
- Single-colour products or products with few options: Shopify's built-in 3D support is enough. Adding a well-prepared GLB model to the product gallery does the job.
- Products with many colours and options: For furniture, accessories and personalised products where options combine, a configurator removes the burden of uploading a separate file for every combination.
- New product launches: The same 3D model also produces product page images and a launch video. See our 3D rendering page for images and our 3D product animation page for video.
Frequently Asked Questions
Can 3D models be added on every Shopify plan?
Yes. The difference between plans is the number of videos and 3D models the store can host. According to Shopify's help pages, it is 250 on Basic, 1,000 on Shopify and 5,000 on Advanced.
Which file format should I upload?
GLB. Shopify generates the USDZ file needed for the AR view on iPhone from the GLB you upload.
Will a 3D model slow the page down?
A well-prepared model will not. In most themes the model loads when the customer touches it; until then a preview image is shown. Keeping the file to a few megabytes decides the experience on phones.
We do not have a 3D model of our product. What should we do?
If you have a CAD file, the model is prepared from it. If not, it is modelled from technical drawings, or from photos and dimensions. The model is built once and used for the Shopify gallery, the configurator, product images and animation.
Does the configurator add the right product to the cart?
Yes. During setup, every selection in the configurator is linked to a Shopify variant. The combination the customer picks on the 3D model is added to the cart as that variant.