threejs▌

Transform reference images into procedural Three.js models.

Provides 3D web graphics expertise specializing in Three.js, React Three Fiber (R3F), and custom GLSL shader development. Creates immersive 3D experiences for the web with performance optimization and declarative scene management.

Systematically create high-quality 3D scenes and interactive experiences using Three.js best practices.

Three.js is the industry-standard JavaScript library for creating 3D graphics in web browsers using WebGL and WebGPU. This skill provides comprehensive guidance for building performant, interactive 3D experiences including scenes, cameras, renderers, geometries, materials, lights, textures, and animations.

Custom GLSL shaders for Three.js with ShaderMaterial, uniforms, varyings, and built-in material extension. \n \n Covers ShaderMaterial vs. RawShaderMaterial, uniform types (floats, vectors, matrices, textures, arrays), and real-time uniform updates in animation loops \n Includes six common shader patterns: texture sampling, vertex displacement, Fresnel effects, noise-based effects, rim lighting, and dissolve effects \n Supports material extension via onBeforeCompile to inject custom code into bu

Nine material types covering unlit, PBR, custom shaders, and specialized rendering effects. \n \n Includes basic, Lambert, Phong, and standard PBR materials with varying lighting complexity; MeshPhysicalMaterial adds advanced features like clearcoat, transmission, and iridescence for glass, car paint, and fabric effects \n ShaderMaterial and RawShaderMaterial enable custom GLSL shaders with automatic or manual uniform/attribute management \n Specialized materials for toon shading, normal debuggi

TSL (Three.js Shading Language) is a node-based shader abstraction that lets you write GPU shaders in JavaScript instead of GLSL/WGSL strings.

Comprehensive assistance with Three.js game development using WebGL, covering 3D rendering, game mechanics, physics, animations, and interactive browser-based games.

Role: Senior WebGL/Three.js Developer

High-performance 3D web applications with Three.js WebGL/WebGPU rendering. \n \n Covers scene setup, geometries, materials (PBR, standard, custom shaders), lights, cameras, and animation systems \n Supports asset loading (GLTF, FBX, OBJ), textures, post-processing effects (bloom, SSAO, SSR), and raycasting for interaction \n Includes performance optimization techniques: instancing, LOD, batching, frustum culling, and WebGPU backend support \n Enables specialized workflows: physics simulations, V