Three.js — A 3D graphics library that leverages WebGL / WebGPU in the browser. Refer to it when building 3D scenes, loading models, creating animations, and implementing shaders.
Directory Structure
skills/threejs/
SKILL.md
references/
getting-started/
README.md
installation.md
creating-a-scene.md
webgl-compatibility-check.md
drawing-lines.md
creating-text.md
loading-3d-models.md
libraries-and-plugins.md
faq.md
useful-links.md
core/
README.md
BufferAttribute.md
BufferGeometry.md
Clock.md
EventDispatcher.md
GLBufferAttribute.md
InstancedBufferAttribute.md
InstancedBufferGeometry.md
InstancedInterleavedBuffer.md
InterleavedBuffer.md
InterleavedBufferAttribute.md
Layers.md
Object3D.md
Raycaster.md
RenderTarget.md
RenderTarget3D.md
Timer.md
TypedBufferAttributes.md
Uniform.md
UniformsGroup.md
scenes/
README.md
Scene.md
Fog.md
FogExp2.md
cameras/
README.md
Camera.md
PerspectiveCamera.md
OrthographicCamera.md
ArrayCamera.md
CubeCamera.md
StereoCamera.md
geometries/
README.md
BoxGeometry.md
CapsuleGeometry.md
CircleGeometry.md
ConeGeometry.md
CylinderGeometry.md
DodecahedronGeometry.md
EdgesGeometry.md
ExtrudeGeometry.md
IcosahedronGeometry.md
LatheGeometry.md
OctahedronGeometry.md
PlaneGeometry.md
PolyhedronGeometry.md
RingGeometry.md
ShapeGeometry.md
SphereGeometry.md
TetrahedronGeometry.md
TorusGeometry.md
TorusKnotGeometry.md
TubeGeometry.md
WireframeGeometry.md
materials/
README.md
material.md
mesh-basic-material.md
mesh-depth-material.md
mesh-distance-material.md
mesh-lambert-material.md
mesh-matcap-material.md
mesh-normal-material.md
mesh-phong-material.md
mesh-physical-material.md
mesh-standard-material.md
mesh-toon-material.md
line-basic-material.md
line-dashed-material.md
points-material.md
shader-material.md
raw-shader-material.md
shadow-material.md
sprite-material.md
node-materials.md
lights/
README.md
Light.md
AmbientLight.md
AmbientLightProbe.md
DirectionalLight.md
HemisphereLight.md
HemisphereLightProbe.md
LightProbe.md
PointLight.md
RectAreaLight.md
SpotLight.md
DirectionalLightShadow.md
PointLightShadow.md
SpotLightShadow.md
IESSpotLight.md
ProjectorLight.md
helpers/
README.md
ArrowHelper.md
AxesHelper.md
BoxHelper.md
Box3Helper.md
CameraHelper.md
DirectionalLightHelper.md
GridHelper.md
HemisphereLightHelper.md
PlaneHelper.md
PointLightHelper.md
PolarGridHelper.md
SkeletonHelper.md
SpotLightHelper.md
objects/
README.md
BatchedMesh.md
Bone.md
ClippingGroup.md
Group.md
InstancedMesh.md
LOD.md
Line.md
LineLoop.md
LineSegments.md
Mesh.md
Points.md
Skeleton.md
SkinnedMesh.md
Sprite.md
textures/
README.md
Texture.md
CanvasTexture.md
CompressedTexture.md
CompressedArrayTexture.md
CompressedCubeTexture.md
CubeTexture.md
CubeDepthTexture.md
Data3DTexture.md
DataArrayTexture.md
DataTexture.md
DepthTexture.md
ExternalTexture.md
FramebufferTexture.md
HTMLTexture.md
Source.md
StorageTexture.md
VideoTexture.md
VideoFrameTexture.md
loaders/
README.md
Loader.md
LoadingManager.md
AnimationLoader.md
AudioLoader.md
BufferGeometryLoader.md
Cache.md
CompressedTextureLoader.md
CubeTextureLoader.md
DataTextureLoader.md
FileLoader.md
ImageBitmapLoader.md
ImageLoader.md
MaterialLoader.md
ObjectLoader.md
TextureLoader.md
loaders-addons/
README.md
GLTFLoader.md
DRACOLoader.md
FBXLoader.md
OBJLoader.md
MTLLoader.md
FontLoader.md
SVGLoader.md
EXRLoader.md
HDRLoader.md
KTX2Loader.md
STLLoader.md
animation/
README.md
AnimationAction.md
AnimationClip.md
AnimationMixer.md
AnimationObjectGroup.md
AnimationUtils.md
KeyframeTrack.md
PropertyBinding.md
PropertyMixer.md
tracks/
README.md
BooleanKeyframeTrack.md
ColorKeyframeTrack.md
NumberKeyframeTrack.md
QuaternionKeyframeTrack.md
StringKeyframeTrack.md
VectorKeyframeTrack.md
math/
README.md
Box2.md
Box3.md
Color.md
Cylindrical.md
Euler.md
Frustum.md
Interpolant.md
Line3.md
MathUtils.md
Matrix2.md
Matrix3.md
Matrix4.md
Plane.md
Quaternion.md
Ray.md
Sphere.md
Spherical.md
SphericalHarmonics3.md
Triangle.md
Vector2.md
Vector3.md
Vector4.md
renderers/
README.md
Renderer.md
WebGLRenderer.md
WebGLRenderTarget.md
WebGLCubeRenderTarget.md
WebGL3DRenderTarget.md
WebGLArrayRenderTarget.md
WebGPURenderer.md
WebXRManager.md
WebXRDepthSensing.md
Info.md
PostProcessing.md
controls/
README.md
OrbitControls.md
ArcballControls.md
DragControls.md
FirstPersonControls.md
FlyControls.md
MapControls.md
PointerLockControls.md
TrackballControls.md
TransformControls.md
extras/
README.md
Curve.md
CurvePath.md
Path.md
Shape.md
ShapePath.md
ArcCurve.md
CatmullRomCurve3.md
CubicBezierCurve.md
CubicBezierCurve3.md
EllipseCurve.md
LineCurve.md
LineCurve3.md
QuadraticBezierCurve.md
QuadraticBezierCurve3.md
SplineCurve.md
nodes/
README.md
TSL.md
Node.md
NodeBuilder.md
AttributeNode.md
UniformNode.md
VaryingNode.md
TextureNode.md
CubeTextureNode.md
OperatorNode.md
MathNode.md
ConditionalNode.md
LoopNode.md
FunctionNode.md
ComputeNode.md
StorageBufferNode.md
MaterialNode.md
LightingModel.md
PhysicalLightingModel.md
samples/
README.md
basic-scene-setup.md
load-gltf-model.md
animating-with-animationmixer.md
custom-buffer-geometry.md
pbr-material-with-lights.md
raycasting-mouse-interaction.md
instanced-mesh.md
post-processing-effect-composer.md
scripts/
README.md
install.md
vite-setup.md
imports.md
dev-server.md
version.md
draco.md
Exploration Procedure
Derive the category from the task, and identify the target page in the category's README.md:
- Find the category corresponding to the task in the mapping table below
- For that category,
references/{category}/README.mdto identify the target page - Of the relevant page,
.mdRead to check the details
Task → Category Mapping
| Task | Category | Reference README |
|---|---|---|
| Want to know project initial setup, creating the first scene, and installation methods | getting-started | references/getting-started/README.md |
| Want to know WebGL compatibility checking, basics of model loading, and text display methods | getting-started | references/getting-started/README.md |
| Want to know how to construct BufferGeometry / BufferAttribute | core | references/core/README.md |
| Want to know Object3D hierarchy manipulation, mouse picking with Raycaster, and delta management with Clock | core | references/core/README.md |
| Want to know shader Uniform / UniformsGroup settings | core | references/core/README.md |
| Want to add objects, lights, and fog to Scene | scenes | references/scenes/README.md |
| Want to blur distant views with Fog / FogExp2 | scenes | references/scenes/README.md |
| Want to set up PerspectiveCamera / OrthographicCamera | cameras | references/cameras/README.md |
| Want to create real-time reflection maps with CubeCamera | cameras | references/cameras/README.md |
| Want to use built-in geometries such as BoxGeometry / SphereGeometry | geometries | references/geometries/README.md |
| Want to create custom shapes with ExtrudeGeometry / LatheGeometry | geometries | references/geometries/README.md |
| Want to set PBR materials with MeshStandardMaterial / MeshPhysicalMaterial | materials | references/materials/README.md |
| Want to write custom GLSL with ShaderMaterial / RawShaderMaterial | materials | references/materials/README.md |
| Want to use node material classes for WebGPU (node-materials) | materials | references/materials/README.md |
| Want to illuminate the scene with DirectionalLight / PointLight / SpotLight | lights | references/lights/README.md |
| Want to set indirect light with AmbientLight or LightProbe | lights | references/lights/README.md |
| Want to adjust shadow settings with DirectionalLightShadow / PointLightShadow / SpotLightShadow | lights | references/lights/README.md |
| Want to handle special light projection patterns with IESSpotLight / ProjectorLight | lights | references/lights/README.md |
| Want to display debug aids with AxesHelper / GridHelper / CameraHelper | helpers | references/helpers/README.md |
| Want to visualize animations and lights with SkeletonHelper / DirectionalLightHelper | helpers | references/helpers/README.md |
| Want to place and manipulate Mesh / Group / Sprite | objects | references/objects/README.md |
| Want to draw many objects in one draw call with InstancedMesh | objects | references/objects/README.md |
| Want to handle skeletal animation with SkinnedMesh / Skeleton | objects | references/objects/README.md |
| Want to set Texture / CubeTexture / VideoTexture | textures | references/textures/README.md |
| Want to do offscreen processing with DataTexture / DepthTexture | textures | references/textures/README.md |
| Want to prepare a write destination for compute shaders with StorageTexture | textures | references/textures/README.md |
| Want to manage loading progress with TextureLoader / LoadingManager | loaders | references/loaders/README.md |
| Want to use FileLoader / ObjectLoader / MaterialLoader | loaders | references/loaders/README.md |
| Want to load .gltf / .glb models with GLTFLoader | loaders-addons | references/loaders-addons/README.md |
| I want to handle compressed assets with DRACOLoader / KTX2Loader. | loaders-addons | references/loaders-addons/README.md |
| I want to load models in other formats with FBXLoader / OBJLoader / STLLoader. | loaders-addons | references/loaders-addons/README.md |
| I want to play, fade, and crossfade animation clips with AnimationMixer. | animation | references/animation/README.md |
| I want to manually create animations with AnimationClip / KeyframeTrack. | animation | references/animation/README.md |
| I want to perform coordinate transformations with Vector3 / Matrix4 / Quaternion / Euler. | math | references/math/README.md |
| I want to use Color / Box3 / Sphere / Frustum. | math | references/math/README.md |
| I want to initialize and configure WebGLRenderer / WebGPURenderer. | renderers | references/renderers/README.md |
| Want to do offscreen rendering / post-processing with WebGLRenderTarget | renderers | references/renderers/README.md |
| I want to manage VR / AR sessions with WebXRManager. | renderers | references/renderers/README.md |
| I want to check the common API of the Renderer base class. | renderers | references/renderers/README.md |
| I want to get statistics on draw call count and memory usage with Info. | renderers | references/renderers/README.md |
| I want to build an effect chain with PostProcessing. | renderers | references/renderers/README.md |
| I want to control the camera with OrbitControls / TrackballControls. | controls | references/controls/README.md |
| I want to interactively manipulate objects with TransformControls / DragControls. | controls | references/controls/README.md |
| I want to handle 2D/3D curves and contours with Curve / Shape / Path. | extras | references/extras/README.md |
| I want to create splines and Bezier curves with CatmullRomCurve3 / CubicBezierCurve. | extras | references/extras/README.md |
| I want to build node-based shaders with TSL (Three.js Shading Language). | nodes | references/nodes/README.md |
| I want to assemble TSL nodes with UniformNode / TextureNode / MathNode. | nodes | references/nodes/README.md |
| I want to write WebGPU compute shaders with ComputeNode / StorageBufferNode. | nodes | references/nodes/README.md |
| I want to implement custom lighting models with PhysicalLightingModel / LightingModel. | nodes | references/nodes/README.md |
| I want to check typical usage and implementation patterns. | samples | samples/README.md |
| I want to know about installation, Vite setup, import patterns, and Draco configuration. | scripts | scripts/README.md |