An AR QR code is a QR code that opens a product’s 3D viewer in a single scan. The customer scans it, the viewer opens, and one more tap places the object in their room at real scale, with no app to install. The code is the entry point, and the AR itself then runs through AR Quick Look on iPhone or Scene Viewer and WebXR on Android. The code itself is simple, but the iPhone’s lack of WebXR, the physical size of the code and the budget of the 3D asset are the constraints to plan around.
QR code or AR code: a link versus a tracking target
A QR code that launches AR works as a link: the phone camera reads the code and the viewer opens in the browser. An AR image target is tracked, so content stays anchored to it. Once the viewer opens from a QR code, the product is placed in the user’s real surroundings.
ARCore’s Augmented Images API is the image-target kind: it extracts grayscale features from reference images such as posters or product packaging, and detects and augments them in the scene. Google’s ARCore guidance says to avoid images with very few features, such as barcodes, QR codes, logos and other line art, because they give poor detection and tracking.
The open-source ARFoundationQRTracking module for Unity lets a GameObject follow a specific QR code on ARKit and ARCore devices, with the limitation that codes containing non-ASCII characters are not supported. That takes a Unity project with AR Foundation and the ARKit or ARCore plugins. On this page, “AR code” means the first kind: a QR code that launches AR, not one the AR tracks.
For the wider picture of what counts as AR and where it is used, our guide on what augmented reality is and where it is applied covers the fundamentals.
How the scan turns into an AR view
On an iPhone, the user opens Camera in Photo mode, frames the code and taps the link that appears at the bottom of the screen. The camera on most Android phones also reads QR codes directly. From there the page opens in the browser, and AR runs through AR Quick Look on iPhone, or Scene Viewer and WebXR on Android.
On the page, the web component <model-viewer> with the ar attribute is a straightforward way to wire this up. Its ar-modes setting lists Scene Viewer, WebXR and Quick Look, and on a supported Android device it shows a button that hands the model to Scene Viewer for placement. On iOS, a link to a USDZ file marked with rel="ar" tells Safari to draw an AR badge and open AR Quick Look directly instead of first navigating to another page.
Can an AR QR code run in the phone’s browser, or does the user need an app?
Yes, it runs without an app on both iPhone and Android, but through different viewers on each. WebXR is the browser route: its Augmented Reality Module defines an immersive-ar session mode whose output is blended with the real world, and it covers handheld phone AR as well as head-worn AR. Android Chrome supports it, with ARCore hit-testing, and is described as the largest reachable browser-AR audience. Safari on iPhone and iPad has no WebXR support at all. Firefox removed its support, which has not returned.
On iPhone, AR runs through Apple’s AR Quick Look, not WebXR. AR Quick Look has been built into iOS since iOS 12 and previews USDZ and Reality files in the user’s surroundings without an app download. From iOS 13 it can launch straight into AR when the user taps a 3D model on a website.
On Android, Scene Viewer shows web-hosted 3D models in AR or 3D from a website or an app. Its AR mode is powered by Google Play Services for AR. If that service is missing or out of date, Scene Viewer falls back to a plain 3D view. Most modern Android devices already have ARCore installed, or install it automatically the first time it is used.
“No app” is true for the user, but the team behind the page is building for three different viewers: WebXR, Scene Viewer and AR Quick Look.
When a QR code is the better AR trigger
The table compares a QR launch trigger, image recognition, QR tracking in an app and markerless placement. These are not exclusive: the no-app QR route launches a viewer that then places the product in the user’s surroundings.
| Approach | What it needs | Fits when | Watch out for |
|---|---|---|---|
| QR code as launch trigger, then browser AR | Any phone camera that reads QR codes; Quick Look on iOS, Scene Viewer or WebXR on Android | The product should appear in the user’s space, at true scale, with no install | The code does not anchor content; size and density must suit the scan distance |
| Image recognition (image target) | An AR app, such as one built on ARCore Augmented Images | Content must stick to a poster, page or package | Image must fill at least 25% of the frame, be flat and in clear view, at 300 × 300 pixels or more; QR codes make poor targets |
| QR code tracked as an anchor | A native app with QR tracking, such as Unity AR Foundation with a tracking module | Content must follow a specific QR code | Non-ASCII codes unsupported in that module |
| Markerless placement | Surface detection, such as WebXR hit-testing via ARCore on Android Chrome | The product should sit on a surface the phone detects | No WebXR on iPhone |
Our judgement: reach for the QR trigger whenever the printed surface is just a doorway into the experience. Image recognition earns its app install only when the content has to stay attached to the printed design itself.
What it takes to build and host the 3D content
Two formats do the work. glTF 2.0 (or its binary form, GLB) is what web viewers like <model-viewer>, three.js and Babylon.js read, and what Scene Viewer expects. AR Quick Look on iPhone and iPad expects USDZ, and glTF files are not natively supported by Quick Look. The usual setup is to hold both and serve the right one by device: USDZ to iPhones, GLB to Android and desktop. <model-viewer> can also generate the USDZ on the fly when the user taps the AR button if no iOS file is supplied, though its own documentation notes that the conversion is imperfect, and animations, for example, are not supported yet.
Source models in older formats need converting. OBJ, FBX, STL, DAE and 3DS are common in workshops and engineering teams, but mobile AR cannot read them directly. Conversion also costs material fidelity. glTF uses the Khronos metallic-roughness PBR model, USDZ maps materials differently, and an automated glTF-to-USDZ conversion can make a product look noticeably different between the two, with metallic surfaces especially prone to this. Every converted asset is worth checking side by side on an iPhone and an Android phone before a single code is printed.
Scale and orientation are fixed by the spec. glTF distances are in metres, +Y is up and the asset faces +Z, and Scene Viewer repeats the rule that 1 unit equals 1 metre so models appear at true size. A model exported in centimetres will show up a hundred times too large.
The asset budget for Scene Viewer
Google publishes the most precise asset guidance, for Scene Viewer. For Scene Viewer:
- Triangles: 100,000 recommended maximum, 30,000 to 50,000 the ideal range.
- Materials: 10 recommended maximum, two of which may use transparency.
- Textures: at most 2048 × 2048, PNG-24 or indexed PNG-8, with JPEG preferred where there is no transparency, in sRGB.
- Hard limits: one UV set per mesh, 254 bones and four bone weights per vertex.
- Animation: only the first animation in the file plays, on a loop.
- Delivery: glTF or GLB over HTTPS.
The same limits are summarised in the product3d guide, which recommends using them as the overall target because the same file usually serves both the 3D viewer and AR. Apple does not publish a size or polygon limit for Quick Look.
File size targets differ between sources. Google recommends 10 MB and its validator reports an error above 15 MB. The rendering studio 360 Render aims for GLB files under 5 MB for most furniture and consumer products, and says that anything approaching 15 to 20 MB creates real usability problems on mobile. Google’s figures are best read as the ceiling the viewer enforces, and the lower practitioner target as the one that matters for a shopper on a mobile connection. Draco mesh compression for geometry and KTX2 textures with Basis Universal encoding are the standard ways to get there, and KTX2 also cuts GPU memory use.
For hosting, the files are served over HTTPS, and for small codes a short address on your own domain redirects to the viewer link.
Where AR QR codes break on real phones
Each failure below comes with a design response.
- The iPhone has no WebXR. Any experience written only for WebXR gives no AR to the single largest mobile audience. Design around it by making a polished, non-immersive 3D viewer the default and treating AR as an enhancement, with AR Quick Look and a USDZ file as a separate iOS path launched by a plain link.
- ARCore is missing on Android. Scene Viewer falls back to 3D when Google Play Services for AR is absent or outdated. To control what those users see, launch Scene Viewer with an explicit intent and a
browser_fallback_url, so every user gets either native AR or a fallback you built. - The AR button lies. “View in AR” buttons that do nothing on unsupported devices are worse than offering no AR at all, so check support first and show the right call to action per device.
- The code is too small for the distance. The scanning distance is roughly ten times the side of the code, and no code should be smaller than 2 × 2 cm. By that rule a 2 cm code reads from about 20 cm away, and a poster seen from 2 m needs a code of around 20 cm (distance divided by ten).
- The code is too dense. A long identifier plus high error correction to fit a central logo makes a dense code; for a jewellery tag or a bottle, encode a short address on your own domain that redirects to the viewer.
- The asset is too heavy or converts badly. Files approaching 15 to 20 MB create real usability problems on mobile, and automated conversion leaves materials looking different between iPhone and Android.
- Browser support changed. Support tables shift as browsers ship updates, so verify current behaviour on the target device before committing to a launch date.
AR QR code examples in retail, industry and education
Retail and packaging
A QR code on a shelf tag, catalogue or box opens the product in 3D, and the customer places it at real scale at home. The argument for it is friction: every added step between discovering a product and exploring it, such as installing an app, creating an account or searching for a page, loses part of the audience. Apple’s Quick Look also supports shopping banners on the web from iOS 13.3, and payment happens after the AR view closes and the customer returns to the retailer’s page, so no payment information is collected inside AR. Our article on AR advertising campaigns shows what augmented reality marketing looks like in practice.
Industry and engineering
Engineering models in STL, FBX or OBJ have to be converted to glTF or USDZ, then reduced to a mobile triangle budget. A code on a machine or spare-parts sheet that opens a true-scale 3D model of the part runs in the browser with nothing to install. Content that must stay locked to the labelled equipment can use an app with QR tracking, such as the ARKit and ARCore approach in the Unity module above. No published industrial study with measured outcomes was found, so treat industrial value as something to test in a pilot, not an assumption.
Education
In Bal and Bicen’s 2016 study at Near East University, 50 undergraduates on a compulsory computer course were split into two groups of 25; one group studied hardware with QR code cards that opened 3D images on their own phones, and by the end of the semester that group showed higher achievement and positive views of the course. This is a single, small experiment in one course, so it supports the pairing for that setting but does not establish a general effect.
FAQ
How do you scan an AR code?
On an iPhone, open Camera in Photo mode, frame the code and tap the link that appears at the bottom of the screen; you can also use the Scan Code control in Control Center. Most Android phones read QR codes from the camera app too, after which the 3D viewer opens in the browser.
