Three.js skills for creating 3D elements and interactive web experiences.
Install This Skill
npx skills add CloudAI-X/threejs-skills# Download SKILL.md and place in your agent's skills folder
curl -o SKILL.md https://github.com/CloudAI-X/threejs-skills/raw/main/SKILL.md/skill add CloudAI-X/threejs-skillsPlugin bundle — 10 sub-skills
upstream is a plugin / umbrellaThis catalog entry is a plugin / umbrella that ships 10 individual SKILL.md files. Each one is listed below — click through to read the full markdown on GitHub.
threejs-animation
Three.js animation - keyframe animation, skeletal animation, morph targets, animation mixing. Use when animating objects, playing GLTF animations, creating procedural motion, or blending animations.
skills/threejs-animationthreejs-fundamentals
Three.js scene setup, cameras, renderer, Object3D hierarchy, coordinate systems. Use when setting up 3D scenes, creating cameras, configuring renderers, managing object hierarchies, or working with transforms.
skills/threejs-fundamentalsthreejs-geometry
Three.js geometry creation - built-in shapes, BufferGeometry, custom geometry, instancing. Use when creating 3D shapes, working with vertices, building custom meshes, or optimizing with instanced rendering.
skills/threejs-geometrythreejs-interaction
Three.js interaction - raycasting, controls, mouse/touch input, object selection. Use when handling user input, implementing click detection, adding camera controls, or creating interactive 3D experiences.
skills/threejs-interactionthreejs-lighting
Three.js lighting - light types, shadows, environment lighting. Use when adding lights, configuring shadows, setting up IBL, or optimizing lighting performance.
skills/threejs-lightingthreejs-loaders
Three.js asset loading - GLTF, textures, images, models, async patterns. Use when loading 3D models, textures, HDR environments, or managing loading progress.
skills/threejs-loadersthreejs-materials
Three.js materials - PBR, basic, phong, shader materials, material properties. Use when styling meshes, working with textures, creating custom shaders, or optimizing material performance.
skills/threejs-materialsthreejs-postprocessing
Three.js post-processing - EffectComposer, bloom, DOF, screen effects. Use when adding visual effects, color grading, blur, glow, or creating custom screen-space shaders.
skills/threejs-postprocessingthreejs-shaders
Three.js shaders - GLSL, ShaderMaterial, uniforms, custom effects. Use when creating custom visual effects, modifying vertices, writing fragment shaders, or extending built-in materials.
skills/threejs-shadersthreejs-textures
Three.js textures - texture types, UV mapping, environment maps, texture settings. Use when working with images, UV coordinates, cubemaps, HDR environments, or texture optimization.
skills/threejs-texturesRelated Skills
Quick Stats
Source repo · this pathAuthor
CloudAI-X
@CloudAI-X