threejs-atmosphere-aer…
Implement physically motivated sky and aerial-perspective systems in Three.js. Use for planetary atmospheres, ground-to-space…
Implement production bloom in advanced Three.js scenes. Use for HDR signal ordering, bloom-node controls, dual selective bloom with guaranteed material restoration, scene-relative emissive hierarchy, and effect-isolation diagnostics.
$ npx -y skills add scottstts/threejs-awesome-graphics-agent-skills --skill threejs-bloom --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
/threejs-bloomContext preview
The summary Claude sees to decide when to auto-load this skill.
Implement production bloom in advanced Three.js scenes. Use for HDR signal ordering, bloom-node controls, dual selective bloom with guaranteed material restoration, scene-relative emissive hierarchy, and effect-isolation diagnostics.
name: threejs-bloom description: Implement production bloom in advanced Three.js scenes. Use for HDR signal ordering, bloom-node controls, dual selective bloom with guaranteed material restoration, scene-relative emissive hierarchy, and effect-isolation diagnostics.
Bloom is a camera/display response to bright HDR signal. Establish scene exposure and emissive luminance before tuning blur.
1. Inspect pre-tone-map luminance. 2. Choose which scene values should bloom. 3. Choose a single-node or dual selective-render ownership model. 4. Calibrate threshold, radius, smooth width, and strength in HDR. 5. Restore all substituted materials transactionally for selective passes. 6. Composite before exposure/tone mapping. 7. Validate base, contribution, and final views.
Read [references/hdr-bloom-system.md](references/hdr-bloom-system.md) for the HDR ordering, dual selective-bloom transaction, compact emissive hierarchy, and the costs and limits of each ownership model.
Apply the material substitution/restoration ownership pattern in the reference before adding selective bloom to a composed scene.
Use `$threejs-exposure-color-grading` for metering, adaptation, tone mapping, and LUTs. Load `$threejs-image-pipeline` only when bloom must be composed with several shared image-space systems. A per-pixel ray integrator that owns its own reduced-resolution target and accumulation history keeps its bloom internal; route that to `$threejs-raymarched-space-effects`.
Example gallery to visually inspect included examples This is a Three.js agent skills pack for producing awesome graphics.
Implement physically motivated sky and aerial-perspective systems in Three.js. Use for planetary atmospheres, ground-to-space…
Direct advanced Three.js camera systems. Use for scale-aware chase rigs, thrust lag, side/orbit cameras, body-relative up…
Build a measured exposure and grading path in Three.js. Use for a 64x36 encoded luminance meter, asynchronous readback, weighted…
Build a deliberate final-image pipeline for advanced Three.js scenes. Use for depth, normal, albedo, and history ownership; GTAO…
Build silhouette-aware parallax occlusion mapping in Three.js WebGPU and TSL. Use for height-field ray marching, relief UVs,…
Build coupled precipitation and affected surfaces in Three.js. Use for falling snow, snow accumulation, model snow caps, wet…