Image to Three.js agent workflow

Turn one object reference into editable procedural Three.js source with your own coding agent. PLAYTEX provides the setup contract, staged quality gates, agent-readable instructions, and complete documentation; your agent performs the build locally in your project.

Copy the setup prompt Agent instructions Read the complete guide

Your agent builds the model

Install the open-source img2threejs skill in Codex, Claude Code, Cursor, OpenCode, or another capable coding agent. Attach a clear PNG, JPG, or WEBP reference and state whether the result is a browser prop, game object, hero render, playable or destructible object, or animation rig.

PLAYTEX does not upload the reference

The product page is a setup and documentation surface. The user's coding agent reads the contract and works inside the authorized project. No PLAYTEX account, PLAYTEX API key, or hosted reference upload is required.

A staged reconstruction instead of a one-shot mesh

  1. Validate whether the image is suitable and admit only readable references.
  2. Write a quality contract and inventory identity-defining details.
  3. Create and strict-validate the component, topology, material, pivot, and attachment spec.
  4. Build in locked passes from blockout through structure, form, materials, interaction, and optimization.
  5. Compare against the reference, review multiple useful angles, and self-correct within a bounded loop.
  6. Return the TypeScript factory, sculpt spec, review evidence, and honest fidelity and limitation notes.

Canonical agent outputs

  • createModel.ts with a factory returning THREE.Group
  • object-sculpt-spec.json with hierarchy, materials, attachments, pivots, sockets, and review state
  • Reference-versus-render comparison and multi-angle review evidence
  • Suitability, fidelity, assumptions, limitations, and reviewed-angle notes

GLB or GLTF export can be added downstream when the user requests it, but the core contract remains editable procedural source.