img2threejs

Reconstructs reference images as quality-gated procedural Three.js models in TypeScript.

Updated Oct 7, 2022
One-click install
npx skills add https://github.com/tamagusko/linux-cfg --skill img2threejs-tamagusko
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: img2threejs
Source: https://github.com/tamagusko/linux-cfg/tree/main/dotfiles/claude/skills/img2threejs
Command: npx skills add https://github.com/tamagusko/linux-cfg --skill img2threejs-tamagusko

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve? Turning a single reference image into a usable 3D model normally requires photogrammetry, mesh downloads, or hand modeling. This Skill rebuilds the subject as code-only procedural Three.js geometry, with staged gates that catch proportion, material, and structure errors before they compound. ## Core Features & Use Cases - Staged sculpt pipeline: Builds models pass by pass (blockout, structure, form, material, lighting, interaction, optimization), with each pass verified against the reference via side-by-side comparison sheets and deterministic review gates. - Detail-first specification: Enumerates identity-defining details (bevels, fasteners, gloss zones, wear) into a strict-quality-gated ObjectSculptSpec before any code is generated, blocking shallow specs. - Domain routes: Handles hard-surface objects, stylized characters with anatomy-aware proportion locks, and CS2 weapon skins via projection-first finish matching from de-lit reference crops. - Use Case: Attach a photo of a knife or product and ask for a Three.js model; the Skill produces a TypeScript factory returning a THREE.Group with pivots, sockets, and colliders, ready to animate in a browser. ## Quick Start Attach a reference image and ask the agent to rebuild this object as a procedural Three.js model preserving its proportions, angles, and colors.

Frequently Asked Questions about img2threejs

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I turn a reference image into a Three.js model?

Attach the image and invoke the skill; it validates the image, writes an assessment and ObjectSculptSpec, then generates a TypeScript factory pass by pass. Each pass is rendered and compared side-by-side against the reference before continuing.

What output does image-to-3D reconstruction produce here?

It produces a JSON ObjectSculptSpec plus a TypeScript createObjectModel factory returning a THREE.Group. The group exposes pivots, sockets, colliders, and a userData.tick hook, so the result is animation-ready rather than a static mesh file.

Does it work with Claude Code, Codex, or OpenCode?

Yes, the skill is agent-agnostic and runs under Claude Code, Codex, or OpenCode. It uses whatever image reading and browser tooling the host provides, and a single shared checkout can be symlinked into each host's skills directory.

Can a single image produce a photoreal 3D reconstruction?

No. A single image cannot reveal hidden sides or guarantee exact geometry, so output is stylized or approximate where the view is ambiguous. Photoreal likeness of a specific person is explicitly out of scope for the code-only approach.

What dependencies are required to run the pipeline scripts?

None beyond Python 3.10 or later. Every forge script uses only the standard library, including PNG handling via struct and zlib, so there is nothing to install with pip.

Why does the generator return BLOCKED instead of code?

The factory generator is fail-closed: it refuses to emit code when the spec fails the strict-quality gate. Refine the spec's components, materials, or detail inventory until validation passes, then rerun generation.