Image to 3D for games: from a picture to a GLB
Three.js runs 266 of the 404 games we list. Code can build a lot of their 3D, from boxes and spheres to shaders, but a capybara, a treasure chest or a knight needs a real mesh.
Image-to-3D tools turn a single picture into that mesh. The raw result often needs work before a game can use it: too many triangles, lighting baked into the colors, no skeleton. This guide covers the whole path, from the picture you feed in to the GLB your game loads. Tool facts are as of September 2026 and linked where they appear.
1. Make a concept image the model can read
The output can only be as clean as the input. Meshy’s guidance fits every tool (Meshy help):
- One object, filling the frame, on a plain white or removed background.
- Front view or a slight angle, no extreme top-down or bottom-up shots, and little perspective distortion.
- Even, diffused light. Shadows in the picture get baked into the texture, so a dramatic key light turns into a permanently dark cheek.
- Characters in an A-pose or T-pose, full body, limbs apart and uncropped. Overlapping arms break auto-rigging later.
Make the picture with any image model, and ask for exactly that: “a single cartoon treasure chest, three-quarter front view, plain white background, soft even studio light, no shadows”. For props with a different back or sides, use multi-view input. Meshy’s Multi Image to 3D endpoint takes 1 to 4 views of one object, with the front view first on Meshy 7.1 (Meshy API). Tripo has a separate multiview-to-model endpoint (Tripo docs).
2. Pick the tool, and read its license first
| Tool | Low-poly option | Rigging | License notes |
|---|---|---|---|
| Meshy 7.1 | target_polycount from 100, Smart Topology |
Humanoids, up to 300,000 faces | Free output is CC BY 4.0 with credit; paid users own it |
| Tripo P1 and H3.1 | P1 is built for low-poly, 48 to 20,000 faces | Biped, quadruped, avian and more | Check the plan terms on Tripo’s site |
| Hyper3D Rodin Gen-2.5 | Smart Low-Poly topology | Not covered here | Paid Creator and Business plans list “unlimited export and any use” |
| Hunyuan3D 2.1 | Open weights | Not covered here | License excludes the EU, UK and South Korea |
| TRELLIS.2 | Open weights, needs a 24 GB NVIDIA GPU | None | MIT |
| Stability SF3D, SPAR3D | Open weights | None | Free commercial use under US$1M annual revenue |
Sources: Meshy API, Meshy plans, Meshy license, Tripo models, Tripo P1, Rodin, Rodin pricing, Hunyuan3D license, TRELLIS.2, Stability license.
Try them. New users who join through our Meshy invite link get 30 days of Meshy Pro for $1, according to Meshy’s referral terms. Tripo has a web studio too.
Both are referral links, so we may earn credits when you sign up. A referral never changes what a guide says or how a game ranks.
Read the free tier’s terms before you generate final assets. Meshy’s free plan gives 100 credits and 10 downloads a month, only of Meshy 6 Lite models (Meshy free plan). That output is licensed CC BY 4.0 and needs a “Model created with Meshy” credit line (Meshy license). If you’d rather not credit a tool, or its free tier limits commercial use, generate final assets on a paid plan and note which plan made which file.
3. Ask for fewer triangles at the start
Every tool can produce millions of triangles, and a browser game wants thousands. Set the budget at generation instead of fixing it later. In Meshy’s API that’s target_polycount (100 to 300,000, default 30,000) or Smart Topology (default 4,000), with topology: "triangle" (Meshy API). Tripo’s P1 model takes a face_limit from 48 to 20,000 (Tripo P1).
Two more Meshy settings are worth knowing. On the Meshy 6 model, remove_lighting is on by default and strips highlights and shadows from the base color. pose_mode set to a-pose or t-pose straightens a character for rigging (Meshy API).
For a budget, 3D Skill Up’s polycount guide puts tiny props at 100 to 2,000 triangles and standard props at 1,000 to 10,000 (polycount guide). Aim for the low end in a browser, and spend more only on the one hero object the camera lingers on.
4. Clean up what the tool got wrong
Open the GLB in Blender and look before you use it. The usual fixes:
- Too dense: the Decimate modifier’s Collapse mode cuts triangles by a ratio (Blender manual).
- Messy topology on something that bends: automatic remeshers don’t produce topology that deforms well, so retopologize characters by hand or with the retopology tools (Blender manual). Static props don’t need it.
- Lost detail after decimating: bake the dense mesh’s detail into a normal map on the light one, with “Selected to Active” baking (Blender manual).
If you work with a coding agent, Blender’s MCP server lets it run these steps for you: “decimate to 3,000 triangles, bake normals from the original, export a GLB”.
5. Rig and animate
Humanoids are easiest. Meshy’s auto-rigging handles humanoid meshes with clear limbs up to 300,000 faces and outputs FBX and GLB with walking and running clips (Meshy rigging). Tripo rigs more body types, including quadrupeds, birds, snakes and fish, and can name the bones for a Mixamo-compatible skeleton (Tripo rigging).
Mixamo is still a common recommendation for humanoid animation. Check that it works for your account before you build a pipeline on it.
6. Shrink the file with glTF Transform
Generated GLBs arrive heavy, mostly because of their textures, and Meshy’s go up to 8K (Meshy API). glTF Transform’s CLI optimizes a file in one command (glTF Transform):
npm install --global @gltf-transform/cli
gltf-transform optimize chest.glb chest-web.glb --compress meshopt --texture-compress webp --texture-size 1024
gltf-transform inspect chest-web.glb
inspect reports whether a scene is geometry-heavy, texture-heavy or has too many draw calls, so you can check the result instead of guessing. Three things to know:
- Compression cuts download size, not frame time. glTF Transform’s docs say neither Draco nor Meshopt improves runtime performance directly (Meshopt docs). Fewer triangles and smaller textures do.
- KTX2 textures cut GPU memory. WebP shrinks the download, but the GPU still unpacks it to full size. KTX2 stays compressed on the GPU; in Khronos’ example the file shrank about 2% while GPU memory fell about 82% (KTX artist guide). Use
--texture-compress ktx2when memory is tight, which it is on phones. - Decimate first. The docs warn that
optimizedefaults may not suit every scene, so bring a million-triangle mesh down in Blender or with a simplify option (gltf-transform optimize -hlists them) before you ship it.
7. Load it in Three.js
Three.js loads a Meshopt- or Draco-compressed GLB with KTX2 textures like this (GLTFLoader docs, three.js example):
import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
import { DRACOLoader } from 'three/addons/loaders/DRACOLoader.js';
import { KTX2Loader } from 'three/addons/loaders/KTX2Loader.js';
import { MeshoptDecoder } from 'three/addons/libs/meshopt_decoder.module.js';
const draco = new DRACOLoader().setDecoderPath('/draco/');
const ktx2 = new KTX2Loader().setTranscoderPath('/basis/').detectSupport(renderer);
const loader = new GLTFLoader().setDRACOLoader(draco).setKTX2Loader(ktx2).setMeshoptDecoder(MeshoptDecoder);
const { scene: chest } = await loader.loadAsync('/models/chest-web.glb');
world.add(chest);
Copy the Draco decoder files from three/examples/jsm/libs/draco/gltf/ and the Basis transcoder from libs/basis/ into your public folder. Reuse one loader for every model.
Twenty coins on screen should be one draw call, not twenty. InstancedMesh draws one geometry and material many times (Three.js docs), and renderer.info.render.calls tells you how many draw calls a frame costs.
Budgets for the browser
No standard sets a triangle budget, so measure on the cheapest phone you want to support. Two numbers from people who build for the web help as a first target. Don McCurdy, the author of glTF Transform, suggests “something like <100 draw calls and <100,000 vertices if you can” (three.js forum). PlayCanvas calls 100 to 200 draw calls “a rough target for low end mobile devices” (PlayCanvas).
Textures bite harder than triangles. One 4096 by 4096 RGBA texture takes about 64 MB of GPU memory before mipmaps. Keep textures at 1024 or 2048 unless the camera sits right on the object.
Licenses and disclosure when you publish
- Steam has a content survey where you disclose pre-generated AI content that ships with the game (Steam).
- itch.io strictly enforces AI disclosure on asset pages and may delist untagged ones (itch.io).
- Copyright: the US Copyright Office says AI output is protected only where a human supplied enough of the expressive choices (USCO). Your edits, cleanup and composition count. Keep the concept images and notes on what you changed.
Next: put the model in a game
- MCP servers for game development: let your agent drive Blender.
- How to make a 3D game with AI: the Three.js game around your models.
- How to make game assets with AI: 2D sprites, textures and style.
- Browse the Three.js games in the catalog.
Games to look at
A Game About Capybaras Delivering Food
Drive capybaras around a cozy open world delivering food without toppling the fruit stack.
Bichitos Rumble
Shove cute animal fighters off the arena in fast, chaotic 3D brawls.
Big Wave Surfing
Paddle into big waves, carve the face, and grab stars before the foam hits.
Astroxite
Take jobs between alien settlements and build a life in a shared frontier.
Questions
What is the best image-to-3D tool for game assets?
It depends on the asset. Meshy and Tripo both offer low-poly modes and auto-rigging, Rodin offers a Smart Low-Poly topology, and Microsoft's TRELLIS.2 runs on your own GPU under the MIT license. Compare license terms first: free tiers often require attribution or limit commercial use.
How many triangles should a browser game model have?
There's no fixed rule, so profile on a real phone. As a starting point, a three.js maintainer suggests under 100 draw calls and under 100,000 vertices per scene, and PlayCanvas names 100 to 200 draw calls as a rough target for low-end phones.
Can I sell a game that uses AI-generated 3D models?
Usually, if the plan you generated on allows commercial use. Steam asks you to disclose AI content that ships with the game, and itch.io requires AI tags on asset pages. The US Copyright Office says AI output is protected only where a human made enough of the creative choices.
What file format should a web game use for 3D models?
glTF, as a single binary .glb file. It's an ISO standard, the image-to-3D tools on this page export it, and Three.js, Babylon.js and PlayCanvas load it directly.