# PLAYTEX Image to Three.js — agent setup This page connects a user's own coding agent to a local, quality-gated image-to-procedural-Three.js workflow. PLAYTEX does not run the agent, receive the reference image, or store the generated model. ## Agent instructions 1. Work in the user's current project unless they name another directory. 2. Check whether the `img2threejs` skill is already installed and readable. 3. If it is missing, install it with the command below. Use the global command for a user-wide install or remove `-g` to pin it to the current repository. 4. Confirm that the skill is available. Ask the user for one reference image and the intended use only if they have not supplied them yet. 5. After the image is supplied, use the installed `$img2threejs` skill. Read its complete `SKILL.md` and all references it requires before taking build actions. 6. Run the skill's intake, quality-contract, staged-build, multi-angle-review, and bounded-correction workflow. Do not stop at analysis or a plan when the user asked for an implementation. 7. Keep the reference and every generated artifact in the user's project. Do not upload them to PLAYTEX. ## Install ```bash npx skills add https://github.com/hoainho/img2threejs --skill img2threejs -g ``` For a project-local install: ```bash npx skills add https://github.com/hoainho/img2threejs --skill img2threejs ``` Manual fallback for Codex: ```bash git clone https://github.com/hoainho/img2threejs.git ~/.codex/skills/img2threejs ``` Manual fallback for Claude Code: ```bash git clone https://github.com/hoainho/img2threejs.git ~/.claude/skills/img2threejs ``` The skill's forge scripts use Python 3.10+ standard library only. A target project needs Three.js when the generated factory is bundled or run. ## First-response contract After setup, respond concisely: > Image to Three.js is ready. Attach or reference one clear object image and tell me the intended use (browser prop, game object, hero render, playable/destructible asset, or animation rig). If you omit the use, I will build a real-time browser prop. Do not claim that a model has been generated during setup. Do not ask for an API key or PLAYTEX account. ## Build prompt When the user supplies the reference, interpret this as the default build contract: ```text Use the installed $img2threejs skill to reconstruct the attached reference as an editable procedural Three.js model. Target: real-time browser prop with an animation-ready hierarchy. Run the complete quality-gated workflow: validate the reference, write the quality contract, inventory identity-defining details, create and strict-validate the sculpt spec, build pass by pass, compare renders from multiple useful angles, self-correct visible mismatches, and verify the final TypeScript factory. Deliver: - createModel.ts returning a THREE.Group - object-sculpt-spec.json - comparison and review evidence - fidelity score, assumptions, and limitations Do not stop at analysis or a plan. Make conservative assumptions for unseen geometry and keep every artifact in this project. ``` The user's explicit intent, output paths, framework, fidelity target, and project instructions override the defaults above. ## Required output contract A complete implementation must include: - `createModel.ts`: TypeScript module importing `three`, exporting at least one zero-argument-compatible `create*Model` factory, and returning a `THREE.Group`. - `object-sculpt-spec.json`: validated sculpt specification containing the component hierarchy, materials, topology choices, attachments, pivots, sockets, build-pass state, and review targets. - comparison/review evidence: reference-versus-render comparisons and applicable multi-angle evidence. - result notes: a short summary, suitability verdict, fidelity from 0 to 1, assumptions, limitations, and reviewed-angle count. - `root.userData.sculptRuntime`: preserved on the returned group for runtime hierarchy and action-ready metadata. GLB or GLTF is not part of the canonical output. Add an exporter only when the user asks for a binary model file in addition to the procedural source. ## Quality gates that may not be skipped - Validate whether the image is a suitable 3D reference before planning geometry. - Write a quality contract and detail inventory before implementation. - Use strict spec validation before code generation. - Build in locked passes: blockout, structure, form, material, lighting, interaction, and optimization as applicable. - Review every pass against the reference; critical identity features must pass their own thresholds. - Check non-planar models from at least two useful camera angles. - Keep appendages attached with explicit parent sockets and contact/overlap data. - Use physically coherent material channels and real lighting. - Bound the correction loop and request better input when the reference cannot support the requested fidelity. - State clearly when the result is approximate, stylized, low-poly, or inferred from hidden surfaces. ## Privacy and security - The website at `https://www.playtex.ai/image-to-threejs` is documentation and setup UI. It does not accept or upload the user's reference image. - Do not transmit the image, generated source, or evidence to PLAYTEX. - Do not request a PLAYTEX API key, OpenAI API key, password, or account for this workflow. - Use credentials already configured for the user's chosen coding agent only as that agent normally permits. - Stay inside the authorized project and installed skill directories. ## Human documentation - Product/setup page: https://www.playtex.ai/image-to-threejs - Complete guide: https://www.playtex.ai/guides/image-to-threejs-guide - Machine-readable manifest: https://www.playtex.ai/image-to-threejs/agent.json - Raw setup prompt: https://www.playtex.ai/image-to-threejs/setup.txt ## Upstream and license The reconstruction workflow is powered by the open-source [`hoainho/img2threejs`](https://github.com/hoainho/img2threejs) skill and its staged forge scripts. Follow the upstream repository's Apache-2.0 license and notices when redistributing its contents. Last reviewed: July 23, 2026.