# Tools

> Every listed resource, editors’ picks first. The filters below can be combined.

- Search: append `?q=<keywords>` to the URL. Separate several keywords with spaces; all of them must match. Matches name, repository, tags, professions, description and README.
- Filter by type: append `?type=<cli|skill|plugin|mcp>` to the URL.
- Filter by profession: append `?profession=<profession id>` to the URL. Separate several ids with commas; a resource matches when it suits any of them. Ids are listed at https://hebbmind.com/api/v1/professions
- Filter by tag: append `?tag=<tag>` to the URL. Separate several tags with commas; a resource must carry all of them. Tags are listed at https://hebbmind.com/api/v1/tags

Tagged `webgl`: 13 items.

- [Three.js](https://hebbmind.com/ko/skill/threejs.md): [Skill] Builds or debugs interactive 3D web scenes with Three.js: scene, camera, renderer, lights, materials, GLTF loading and controls, plus performance basics like capping pixel ratio, handling resize, disposing WebGL resources and reduced motion.
- [WebGL Landing Steering](https://hebbmind.com/ko/skill/webgl-landing-steering.md): [Skill] Steers WebGL-heavy landing pages toward a chosen look by picking one of four visual lanes per page type, passing message, performance, accessibility and reliability gates, and outputting a lane, visual spec, stack, fallback and build order.
- [Cobe.js](https://hebbmind.com/ko/skill/cobejs.md): [Skill] Adds a lightweight interactive WebGL globe with the cobe library: canvas sizing for device pixel ratio, location markers, rotation in onRender, resize handling and teardown, for plain pages or React/Next.js hero sections.
- [Three.js Animation](https://hebbmind.com/ko/skill/threejs-animation.md): [Skill] Three.js animation reference with code: procedural motion with Clock, the AnimationClip, AnimationMixer and AnimationAction keyframe system, playing GLTF animations, skeletal animation, morph targets and blending multiple animations.
- [Three.js Fundamentals](https://hebbmind.com/ko/skill/threejs-fundamentals.md): [Skill] Three.js fundamentals with code: setting up the scene, cameras and WebGLRenderer, Object3D hierarchy, coordinate systems and transforms, the render loop and resize handling. A starting point for building a 3D scene on the web.
- [Three.js Geometry](https://hebbmind.com/ko/skill/threejs-geometry.md): [Skill] Three.js geometry reference with code: parameters for built-in shapes like boxes, spheres, cylinders and tori, building custom meshes from vertices with BufferGeometry, and instanced rendering for large numbers of objects.
- [Three.js Interaction](https://hebbmind.com/ko/skill/threejs-interaction.md): [Skill] Three.js interaction reference with code: raycasting for click detection and object selection, camera controls such as OrbitControls, and mouse and touch input handling for interactive 3D experiences.
- [Three.js Lighting](https://hebbmind.com/ko/skill/threejs-lighting.md): [Skill] Three.js lighting reference with code: ambient, hemisphere, directional, point, spot and area lights with their cost and shadow support, shadow setup, image-based environment lighting and lighting performance tips.
- [Three.js Materials](https://hebbmind.com/ko/skill/threejs-materials.md): [Skill] Three.js materials reference with code: when to use Basic, Lambert, Phong, Standard, Physical, Toon and other materials, PBR properties such as roughness and metalness, custom ShaderMaterial and material performance.
- [Three.js Post-Processing](https://hebbmind.com/ko/skill/threejs-postprocessing.md): [Skill] Three.js post-processing reference with code: chaining passes with EffectComposer, adding bloom, depth of field, color grading, blur and glow, and writing custom screen-space shader passes.
- [Three.js Shaders](https://hebbmind.com/ko/skill/threejs-shaders.md): [Skill] Three.js shader reference with code: writing GLSL vertex and fragment shaders, ShaderMaterial versus RawShaderMaterial, uniforms and animating them, and extending built-in materials for custom visual effects.
- [Three.js Textures](https://hebbmind.com/ko/skill/threejs-textures.md): [Skill] Three.js texture reference with code: loading and configuring texture maps, UV mapping, cubemaps and HDR environment maps, texture settings and optimization.
- [WebGL Components](https://hebbmind.com/ko/skill/webgl-components.md): [Skill] Guides building small always-on WebGL visuals (avatars, ambient orbs, glass and iridescent surfaces) inside product UI: one shared context, a single capped frame loop, cheap fragment shaders, context-loss handling, a mandatory non-WebGL fallback, and React SSR and Server Components pitfalls.
