The easiest way to embed a GLB on your website is "model-viewer", a web component published by Google. Add one script element to load it, put a model-viewer tag on the page with the GLB's location in its src attribute, add the camera-controls attribute, and visitors get a 3D model they can rotate with a mouse or a finger.
This guide compares three ways of putting a GLB on the web, walks through embedding with model-viewer and what the main attributes do, then covers fixes when the model doesn't appear, how it behaves on phones, and how to lay things out once you have several works. Because the safest way to get the HTML right — version number included — is to copy it from the official documentation, this article explains the attribute names and their roles and links to the official pages for the code itself. The model-viewer details were checked against the official documentation as of November 2026.
Note: Figmee currently offers figurine-style images created from your drawings, 3D model data (GLB / 3MF), and turntable videos of your 3D models. Ordering physical 3D prints is Coming Soon. Photos, and images that look like photos, can't be turned into 3D — Figmee works from drawings.
What are the ways to put a GLB on a web page?
There are three ways to let visitors rotate a GLB in their browser: embed it in your own site, send a share link from the service you made it with, or upload it to a 3D sharing site and embed it from there. If you want the model inside your own site, styled your way, embedding with model-viewer is the right fit.
| Method | Shows inside your own site? | Effort | File size | Best for |
|---|---|---|---|---|
| Embed with model-viewer | Yes | Edit your HTML and host the GLB yourself | The GLB is loaded as is, so slimming it down is up to you | People with a portfolio site who can edit HTML |
| Figmee share link | No (you send a link) | Flip one switch on the work page | Nothing to worry about | Showing a model you made with Figmee right away |
| A sharing site such as Sketchfab | Yes, by pasting its embed code | Create an account and upload | Follows the site's limits | Keeping models from different tools in one place |
On Sketchfab, the Embed button below the viewer on a model's page gives you the HTML to paste into your own page, and the help center says private and password-protected models can be embedded too (source: Sketchfab Help Center, "Embedding your 3D models", as of November 2026). The steps for sharing with a link, and what becomes visible when you publish, are covered in how to share a 3D model online.
What is model-viewer?
model-viewer is an open-source web component from Google (Apache License 2.0) that displays a 3D model and lets people rotate it, all from a single tag on the page. It reads glTF and GLB only, and the official FAQ says it plans to support only that format going forward (source: model-viewer FAQ, as of November 2026).
- How to load it: paste the script element with
type="module"shown in the official README into your page. It loads from Google's CDN (ajax.googleapis.com), with the version number in the middle of the URL. On npm, it's published as@google/model-viewer(source: model-viewer README, as of November 2026). - Version: as of November 7, 2026, the latest version on npm is 4.4.0 (source: npm, "@google/model-viewer").
- Browser support: the README says it supports the last two major versions of all evergreen desktop and mobile browsers (such as Chrome, Firefox, Safari and Edge).
A Figmee GLB bundles shape and color (textures) into one file, so there are no separate images to host — uploading the single GLB is enough. How GLB files work is explained in what is a GLB file, and which drawings translate well into 3D is covered in the complete guide to turning an illustration into 3D.
How do you embed it, step by step?
There are five steps: prepare and slim down the GLB, host it, add the loading line, place the tag with its attributes, and check on desktop and phone. On a site where you can edit HTML, plan on about 30–50 minutes for your first model.
- Prepare and slim down the GLB (10–30 minutes): in Figmee, select "Save" on the work page and choose "3D model (GLB)" (saving doesn't use extra tokens). If it looks like it will load slowly, slim it down in this order: shrink textures, reduce polygons, compress (see how to reduce GLB file size).
- Host the GLB (5 minutes): the simplest option is uploading it to the same server (same domain) as the page. If you host it on a different domain, that server has to send CORS headers (see "What if it loads slowly or doesn't show up?" below).
- Add the loading line (2 minutes): copy the script element from the official README, fill in the version number (for example 4.4.0), and paste it into the page's head.
- Place the tag and set attributes (5 minutes): put a
model-viewertag where you want the model, setsrcto the GLB's URL andaltto a short description, and addcamera-controls. Pick any other attributes from the table below. Examples of the markup are in the model-viewer documentation. - Check on desktop and phone (5 minutes): make sure the model rotates, see what shows while it loads, confirm you can still scroll the page vertically on a phone, and check that the colors and shine look right.
These are the attributes you'll use most (source: model-viewer documentation, as of November 2026):
| Attribute | What it does | Notes |
|---|---|---|
src | URL of the GLB to display | glTF and GLB only |
alt | Text describing the model | Write a short line about the work so people using screen readers know what it is |
camera-controls | Lets people rotate with mouse or touch | The docs say it should nearly always be specified |
auto-rotate | Rotates the model automatically | Starts after 3000 ms by default (auto-rotate-delay); speed is set with rotation-per-second |
poster | Image shown until the model has loaded | The FAQ recommends always using a seamless poster |
loading | When to load (auto, lazy, eager) | The default, auto, loads as the model nears the viewport; eager loads immediately |
camera-orbit | Starting camera angle and distance | Default is "0deg 75deg 105%" (horizontal angle, vertical angle, distance) |
touch-action | How it shares touch gestures with page scrolling (pan-y, pan-x, none) | The default, pan-y, keeps vertical scrolling while horizontal drags rotate the model |
shadow-intensity | Darkness of the shadow under the model | 0 turns the shadow off |
exposure | Brightness (exposure) | Adjust if the model looks too bright or too dark |
ar | Enables AR on supported devices | Each device has its own requirements, so try it last |
Figmee GLBs don't contain animation, so you won't need model-viewer's animation attributes. The pose can't be changed either, so set the angle you want to show with camera-orbit, which positions the camera when the page loads.
What if it loads slowly or doesn't show up?
When nothing appears, check three things in order: the GLB's URL, the domain it's hosted on (CORS), and the loading line. If the model shows up but looks wrong, find the symptom in the table below.
| Symptom | Common cause | Fix |
|---|---|---|
| Nothing appears | Wrong src URL, missing loading line, or wrong version number | Open the browser's developer tools and check the console and network panels to see whether the GLB and the script loaded |
| Only a GLB on another domain fails | Blocked by CORS | Configure the server hosting the GLB to send CORS headers that allow your page's domain (per the official FAQ) |
| Nothing appears when you open the HTML file straight from your computer | Browsers may block loading from a page opened as a local file | Test through a local server or on your real server |
| It takes a long time to appear | The GLB is large | Slim it down, starting with the textures, and use poster to make the loading state look good |
| A compressed GLB doesn't appear | It was compressed with meshopt | model-viewer doesn't enable its meshopt decoder by default. Recompress with Draco, or set meshoptDecoderLocation |
| Edges shine like metal | The material's Metallic value is high | Lower the material's Metallic value in Blender and export again (explained below) |
The CORS explanation is in the official FAQ under "Why am I getting CORS errors?", and the default decoder locations are under dracoDecoderLocation and meshoptDecoderLocation in the documentation (both as of November 2026).
The last one, shiny edges, is something you're likely to see with GLBs made in Figmee. Figmee GLBs are exported with a high Metallic value on their materials, and Figmee's own viewer displays them with Metallic set to 0. As a result, the same GLB can show metallic-looking highlights along the sculpted edges in model-viewer or other viewers. If that bothers you, import it into Blender, bring the material's Metallic value close to 0 (if an image is connected to the Metallic input, disconnect it before changing the value), export the GLB again, and check whether the shine has changed where you host it. How to import into Blender is covered in how to bring a Figmee GLB into Blender.
Does it work on phones?
Yes. model-viewer supports mobile browsers, and with camera-controls visitors can rotate the model by dragging a finger. Two things need attention: how it shares gestures with page scrolling, and memory.
- Scrolling: with the default
touch-actionof pan-y, a vertical swipe scrolls the page and a gesture that starts horizontally rotates the model. Setting it to none stops the page from scrolling over the model at all, so if the model fills the screen, make sure visitors can still get past it. - Memory: large textures use a lot of memory when displayed, even if the file itself is small, and that can make phones struggle. Lowering texture resolution helps (details in how to reduce GLB file size).
Adding the ar attribute lets visitors on supported devices launch AR (placing the 3D model in their surroundings through the camera). Google publishes recommendations for Android's Scene Viewer, such as file size and triangle count, along with which extensions it accepts (source: Google ARCore, "Scene Viewer", as of November 2026). If you want AR, test with a GLB that meets those requirements.
How should you lay things out once you have more works?
Every extra model on a page adds loading and memory. A layout that tends to stay light is a gallery page of still images (the same images you use as posters) linking to one page per work, each with a single rotatable model.
- Images in the gallery, 3D on the detail page: show the rotatable model once a visitor opens a work's page.
- If you place several on one page: the default
loading(auto) loads each model as it nears the viewport, so models further down load only when visitors scroll to them. Giving every model aposterkeeps the layout tidy before anything loads. - Show it next to the original drawing: placing the original illustration beside the 3D makes it clear which drawing the 3D came from.
If you don't have your own site, or want one place to gather everything, Figmee's creator page can help: turn on the public setting in My Page and you get a profile page listing your published works. For ways to send a GLB to someone so they can view it, see 5 free ways to view 3D models.
FAQ
Can I use it on WordPress or other blogging platforms?
It depends on whether the platform lets you add HTML that includes a script element. Where it doesn't, model-viewer may not be an option. In that case, use a Sketchfab embed (Sketchfab's help center also explains how to embed on WordPress and similar platforms) or link to a share page.
Can visitors save my GLB?
To display the model, the GLB file is sent to the visitor's browser. Assume that anyone who finds the URL can save it. If the model comes from art you commissioned, check with the artist before publishing (see can you turn commissioned art into 3D?).
Does it cost anything?
model-viewer is open source, and using it is free. Hosting the GLB costs whatever your hosting service charges. On Figmee, generating a 3D model uses 5 tokens (your first model per account is free), and saving the GLB doesn't use extra tokens.
Summary
model-viewer is the easiest way to embed a GLB on your website. Slim down the GLB, host it, copy the loading line from the official README, start with src, alt and camera-controls, and add poster or auto-rotate as needed. If nothing shows up, check the URL, CORS and the loading line; if the edges shine, check the material's Metallic value. On phones, watch the interaction with scrolling and the size of your textures.
If you want a rotatable 3D version of your character in your portfolio, make a 3D model from your drawing in Figmee, save the GLB, and embed it with the steps above.
