What problem does it solve? Setting up a Three.js scene involves many interdependent pieces—cameras, renderers, lights, object hierarchies, and math utilities—and getting any of them wrong leads to blank screens, distorted views, or memory leaks. This Skill provides correct, ready-to-use patterns for the core Three.js building blocks. ## Core Features & Use Cases - Scene and Renderer Setup: Configure WebGLRenderer with tone mapping, color space, shadows, and pixel ratio, plus scene backgrounds, fog, and environment maps. - Camera Configuration: Create Perspective, Orthographic, Array, and Cube cameras with correct projection settings and resize handling. - Object Hierarchy and Math: Manage Object3D transforms, groups, layers, and use Vector3, Matrix4, Quaternion, Euler, and Color utilities. - Use Case: You are building a 3D product viewer for an e-commerce page. Use this Skill to scaffold the scene, add lighting and shadows, wire up a responsive canvas, and follow proper disposal patterns to avoid GPU memory leaks. ## Quick Start Ask the AI to create a Three.js scene with a perspective camera, an animated rotating cube, lighting, and responsive resize handling.
