About threejs-interaction
A skill for adding interaction to Three.js scenes. It guides work involving raycasting, object picking, pointer or touch input, and camera controls, with an emphasis on validating behavior and cleanup.
Key features
- 01Raycasting and object picking
- 02Pointer and touch input
- 03Camera controls
- 04Interaction-focused 3D scenes
Use cases
- 01Adding object selection to a canvas
- 02Handling pointer input after resize or scroll
- 03Supporting keyboard-based selection
- 04Cleaning up listeners and controls on unmount
Install
Copy the command and run it in a terminal.
$
npx skills add https:/After installing, type/threejs-interactionin Claude Code to confirm it loaded.
Bundled filesreferences/detailed-guide.md
Details
From the project READMEThree.js Interaction
Detailed Guide
Read the detailed guide before executing this skill. It retains the complete procedure and reference material. Treat its safety, prerequisites, and validation requirements as mandatory. For focused work, load the relevant sections; for end-to-end work, read the guide completely.
When to Use
- You need user interaction inside a Three.js scene.
- The task involves raycasting, object picking, pointer handling, touch input, or camera controls.
- You are building an interactive 3D experience rather than a passive render.
Example
Add pointer selection to this canvas using its bounding rectangle, test after resize/scroll and provide keyboard selection. Dispose listeners/controls on unmount and verify picking nested meshes.
Limitations
- Use this skill only when the task clearly matches the scope described above.
- Do not treat the output as a substitute for environment-specific validation, testing, or expert review.
- Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.
Comments
Markdown supported