Log in

AI for Three.js

Image to 3D Model: AI Tools That Convert a Photo to a Mesh

Image-to-3D AI tools generate a 3D mesh from one or more reference photos. Feed in a photo of an object, get back a textured glTF/GLB or OBJ model, and it will generally be more geometrically accurate than text-to-3D generation for a specific real object, since the model has actual visual reference to reconstruct from rather than working purely from a text description.

Last updated . Verified against three.js r181.

Read the FAQJump to code
Isometric diagram of AI skills, tools and workflows feeding a Three.js scene

[01]

How image-to-3D generation works

Most current tools use one of two underlying approaches: multi-view diffusion, where the AI generates several consistent virtual viewpoints of the object from your single input image and reconstructs a mesh from them, or photogrammetry-adjacent reconstruction, closer to traditional multi-image 3D scanning but AI-assisted to work from far fewer source photos than classic photogrammetry needs.

Results are generally better with a clean, well-lit, single-object photo (or several angles of the same object) than with a busy scene. Background clutter, reflective surfaces and thin structures (wires, fine mesh) remain the hardest cases for every current generator.

[02]

Single image vs multiple angles

A single photo is the fastest path and works reasonably well for objects with a clear, guessable back side (a mug, a simple product). For anything with meaningful detail on multiple faces, feeding in 2-4 photos from different angles, where the tool supports it, noticeably improves accuracy on the sides the AI would otherwise have to hallucinate.

[03]

Getting the result production-ready for Three.js

A generated model is rarely web-ready straight out of the tool. See the AI 3D model generators guide for the fuller checklist. Two issues specific to image-to-3D: texture projection artifacts on faces the source photo didn't clearly show (often visible as blurry or stretched texture on the model's "back"), and inconsistent scale, since the generator has no real-world size reference from a single photo. Always re-normalize scale in your Three.js scene rather than trusting the exported units.

Code

Normalizing scale on load (r181)
1import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'
2
3const loader = new GLTFLoader()
4loader.load('/models/generated-from-photo.glb', (gltf) => {
5  const box = new THREE.Box3().setFromObject(gltf.scene)
6  const size = box.getSize(new THREE.Vector3())
7  const targetSize = 1 // your scene's unit for "one object"
8  gltf.scene.scale.setScalar(targetSize / Math.max(size.x, size.y, size.z))
9
10  // re-center so the object's base sits at y = 0
11  const center = box.getCenter(new THREE.Vector3())
12  gltf.scene.position.sub(center.multiplyScalar(gltf.scene.scale.x))
13  scene.add(gltf.scene)
14})
Masking a stretched-texture side
1import { texture, uv, mix, vec3 } from 'three/tsl'
2
3// A quick fix for the common "blurry back face" artifact: blend the
4// original texture with a flat fill on the back hemisphere of a mostly
5// front-facing object, rather than showing the AI's guess at unseen detail.
6const material = new THREE.MeshStandardNodeMaterial()
7material.colorNode = mix(texture(generatedAlbedo), vec3(0.4, 0.4, 0.42), uv().x.smoothstep(0.7, 0.95))

Learn this properly

Learn Practical TSL

Your First Node Material

Node materials help mask or re-texture the artifacts image-to-3D generation can leave behind.

Start the lesson (6 minutes) →

F.A.Q

Frequently asked questions

The questions that come up most often on this topic.

How accurate are image-to-3D AI models?

Accuracy varies by tool and subject, but is generally higher than text-to-3D for a specific real object, since the AI has visual reference. Simple, clearly-photographed objects convert best; reflective, thin, or complex-topology objects remain the hardest cases across every current tool.

Can I convert a photo to a 3D model for free?

Several tools offer a free tier, typically with limits on resolution, export format, or the number of generations per month. Check the specific tool's current pricing, as free-tier terms change frequently.

Do I need multiple photos to generate a 3D model?

No, most tools accept a single image, but providing 2-4 photos from different angles (where supported) noticeably improves accuracy on the sides the AI can't see in one photo.

Building this for a client?

I take this kind of work as a white-label subcontractor for agencies: scoped in writing, delivered under your brand, documented for your team.

For agencies →

Keep reading

AI 3D Model Generators

AI 3D model generators turn a text prompt or a reference image into a usable 3D mesh. Tools like Meshy, Tripo and Rodin …

Text to 3D

Text-to-3D AI tools generate a 3D model directly from a written description, such as "a low-poly pine tree" or "a worn l…

GLTFLoader

GLTFLoader is the standard way to load 3D models into Three.js: instantiate it, call loader.load(url, onLoad), and add g…

All AI for Three.js

Back to the ai hub.