threejs-atmosphere-aer…
Implement physically motivated sky and aerial-perspective systems in Three.js. Use for planetary atmospheres, ground-to-space…
Implement volumetric cloud systems in Three.js. Use for weather-driven density, bounded raymarching, shape/detail erosion, vertical profiles, lighting cones, silver lining, temporal reconstruction, cloud shadows, multiple layers, and scalable quality modes.
$ npx -y skills add scottstts/threejs-awesome-graphics-agent-skills --skill threejs-volumetric-clouds --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
/threejs-volumetric-cloudsContext preview
The summary Claude sees to decide when to auto-load this skill.
Implement volumetric cloud systems in Three.js. Use for weather-driven density, bounded raymarching, shape/detail erosion, vertical profiles, lighting cones, silver lining, temporal reconstruction, cloud shadows, multiple layers, and scalable quality modes.
name: threejs-volumetric-clouds description: Implement volumetric cloud systems in Three.js. Use for weather-driven density, bounded raymarching, shape/detail erosion, vertical profiles, lighting cones, silver lining, temporal reconstruction, cloud shadows, multiple layers, and scalable quality modes.
Cloud quality comes from density organization, lighting, and temporal stability—not from increasing march steps over unstructured noise.
This skill contains exemplary examples and assets beyond descriptive guidance, they're worth studying, referencing, or even copying. Use them sufficiently when relevant and do NOT blindly skip them.
1. Define the cloud volume and layer bounds. 2. Generate or source weather, base-shape, detail, and turbulence fields. 3. Build a density function with vertical and weather profiles. 4. Raymarch only the bounded occupied segment. 5. Integrate transmittance and lighting front-to-back. 6. Reconstruct low-resolution output temporally. 7. Project a separate low-cost cloud-shadow solution.
Read [references/weather-volume-and-reconstruction.md](references/weather-volume-and-reconstruction.md) before implementing or auditing the cloud system.
Read the [weather volume cloud entry](examples/weather-volume-clouds/cloud-effect.js) and its `source/` modules for weather-layer ownership, spherical shell bounds, authored shape/detail sampling, cloud shadow maps, temporal upscale, atmospheric composition, and package-owned diagnostics.
Use `$threejs-atmosphere-aerial-perspective` for molecular/aerosol scattering without weather density. Use `$threejs-procedural-vfx` for emissive aurora curtain slabs or bounded interactive voxel fire and smoke with velocity, pressure, emitter, and collision fields. This skill owns weather-shaped cloud volumes, reconstruction, cloud lighting, and cloud shadows.
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…
Implement production bloom in advanced Three.js scenes. Use for HDR signal ordering, bloom-node controls, dual selective bloom…
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,…