Agent skill · design visual · secondsky

threejs

Three.js 3D graphics library - scene setup, geometry, materials, lighting, textures, animation, loaders, shaders, postprocessing, interaction. Use when building 3D web experiences, creating WebGL visualizations, working with GLTF models, implementing custom shaders, or adding interactive 3D elements to web applications.

Why this skill is useful

Provides detailed domain-specific knowledge and working code examples for Three.js that the AI wouldn't reliably generate on its own.

What it needs

About 6k tokens when loaded. Last updated 2026-08-06. 204 stars on the source repository.

What this skill does

Three.js Skills Overview Comprehensive knowledge base for building 3D web experiences with Three.js. This skill provides accurate API references, best practices, and working code examples across all major Three.js domains. Three.js version: r160+ (January 2024) Quick Reference Core Topics This skill covers 10 essential Three.js domains: 1. Fundamentals - Scene setup, cameras, renderer, Object3D hierarchy 2. Geometry - Built-in shapes, BufferGeometry, custom geometry, instancing 3. Materials - PBR materials, shader materials, material properties 4. Lighting - Light types, shadows, environment lighting 5. Textures - UV mapping, environment maps, render targets 6. Animation - Keyframe animation, skeletal animation, animation mixing 7. Loaders - GLTF/GLB loading, async patterns, caching 8. Shaders - GLSL basics, ShaderMaterial, custom effects 9. Postprocessing - EffectComposer, bloom, DOF, custom passes 10. Interaction - Raycasting, camera controls, mouse/touch input When to Load References Load detailed reference files based on your current task: Basic scene setup, cameras, renderer → Load references/threejs-fundamentals.md Creating shapes, custom geometry, instancing → Load references/threejs-geometry.md Material properties, PBR, shader materials → Load references/threejs-materials.md Adding lights, configuring shadows → Load references/threejs-lighting.md Texture loading, UV mapping, environment maps → Load references/threejs-textures.md Animating objects, GLTF animations, mixing → Load references/threejs-animation.md Loading GLTF/GLB models, Draco compression → Load references/threejs-loaders.md Writing GLSL shaders, custom visual effects → Load references/threejs-shaders.md Adding bloom, depth of field, screen effects → Load references/threejs-postprocessing.md Raycasting, mouse picking, camera controls → Load references/threejs-interaction.md Quick Start Examples 1. Fundamentals: Basic Scene 2. Geometry: Creating Shapes 3. Materials: PBR Materials 4. …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills secondsky/threejs

View the source on GitHub

Browse the @skills marketplace