img2threejs: a staged sculpting pipeline that reconstructs objects from single images into procedural Three.js code

What it solves

It addresses the difficulty of converting a single reference image into a high-quality, animation-ready 3D model. Instead of using heavy mesh files or photogrammetry, it generates lightweight, procedural code that can be rendered directly in a web browser.

How it works

The project uses a staged sculpting pipeline where an AI agent (like Claude Code) acts as the sculptor. The process follows a strict sequence: blockout, structural pass, form refinement, material pass, surface pass, lighting pass, interaction pass, and optimization pass. Each stage is gated by Python scripts that validate the work against the reference image. The agent must pass a visual review (comparing a side-by-side render to the original) before moving to the next stage. This ensures the final output is a TypeScript factory that builds the object using primitives, procedural shaders, and generated geometry.

Who it’s for

• Game developers looking for lightweight, code-based 3D assets.
• Web developers needing animation-ready Three.js models without large file downloads.
• AI engineers building agentic workflows for 3D asset generation.

Highlights

• Token-efficient design: Uses deterministic Python scripts for validation and bookkeeping, reserving expensive LLM tokens only for visual judgment.
• Animation-ready: Generates a runtime hierarchy including pivots, sockets, and colliders.
• Procedural reconstruction: Rebuilds objects from code (primitives and shaders) rather than extracting meshes.
• Agent-agnostic: Designed to work with various AI coding tools and vision models via a skill-based architecture.