QuickMatch.si

Three.js Skills (r186)

Agent skill by CloudAI-X · for Claude Code

Ten Claude Code skills that teach the current three.js API (r186): scenes, geometry, materials, lighting, textures, animation, glTF loaders, shaders and TSL, post-processing and interaction, each with a Common Mistakes list.

Install

npx skills add cloudai-x/threejs-skills

Run it in a terminal, then start a new agent session so the skill loads. Read the repo's README and scripts before you install: skills run with your agent's permissions.

What it does

Three.js Skills is a set of ten skill files that give Claude Code current knowledge of three.js, targeting release r186 ([email protected]). The README explains that models trained on many releases still write outdated code, such as RGBELoader instead of HDRLoader or Clock instead of Timer, and these skills supply the current API instead.

The skills cover fundamentals (scene, cameras, renderer, animation loop), geometry including instancing and BatchedMesh, materials and node materials, lighting and shadows, textures and color spaces, keyframe, skeletal and morph animation, glTF loading with Draco, meshopt and KTX2, custom shaders with ShaderMaterial and TSL, post-processing and the WebGPU RenderPipeline, and raycasting, controls and selection.

Every skill has a runnable quick start, a WebGPU and TSL section, a Common Mistakes list that maps outdated code to the r186 fix, and links to related skills. The maintainer states the examples were checked against the published [email protected] package and the official migration guide.

Features

  • Ten skills covering the core three.js API
  • Targets three.js r186 with WebGPU and TSL sections
  • Common Mistakes lists for outdated patterns
  • glTF, Draco, meshopt and KTX2 loading
  • Shaders, post-processing and interaction

Limits

  • General three.js knowledge, not game systems
  • Pinned to r186; other releases may differ
  • Written for Claude Code

Browse all 30 agent skills