Procedural Weather Threejs — Development skill for Claude Code
Generate dynamic procedural weather effects in Three.js using WebGPU compute with WebGL2 fallback.
How to install Procedural Weather Threejs
This entry records only its repository, not the path inside it, so there is no
exact command to give. Open CK42BB/procedural-weather-threejs and copy the folder into
~/.claude/skills/, or the file into ~/.claude/agents/.
What Procedural Weather Threejs does
Generate dynamic procedural weather effects in Three.js using WebGPU compute with WebGL2 fallback.
Alternatives in Development
- Cs2 Knife — Create a high-fidelity procedural Three.js 3D reconstruction of 14.1k ★
- Param Discover — Discover hidden HTTP parameters on a URL or list of URLs using Arjun (or x8 fallback) 4.5k ★
- React Native Restate — Build a full-stack Real Estate app from scratch with Google Authentication, dynamic routing, and more 678 ★
README
Procedural Weather — Three.js Skill
A Claude Code skill for generating dynamic procedural weather systems in Three.js, with **GPU particle precipitation**, volumetric fog, lightning, optical effects, and smooth state transitions. **WebGPU compute with WebGL2 fallback**.
Part of the **Teaching Three.js** skill series.
What This Skill Does
When installed, this skill teaches Claude Code how to build complete weather systems including:
- Rain — GPU particle
LineSegmentswith wind-angled drops, ground splashes, and wet lens camera overlay (drizzle → monsoon intensity range) - Snow —
Points-based flakes with sinusoidal flutter, tumble, sparkle, size variation, and frost camera overlay (flurries → blizzard) - Fog — exponential scene fog plus shader-driven ground fog with noise wisps and wind drift
- Lightning — procedural branching bolts with recursive midpoint displacement, glow layer, and PointLight flash illumination
- Dust/Sandstorm — swirling particle field with atmospheric color tinting
- Aurora Borealis — undulating displaced plane with multi-color gradient and additive glow
- Rainbow — torus-arc with ROYGBIV spectral gradient
- Camera post-processing — wet lens (droplets + streaks + refraction) and frost overlay (edge-creeping ice crystals)
- Weather state machine — 12 states with smooth parameter interpolation, transition routing, and biome presets
Installation
Claude Code (CLI)
claude install-skill path/to/procedural-weatherOr copy the `procedural-weather/` folder into your Claude Code skills directory.
Manual Usage
| File | Purpose |
|---|---|
SKILL.md |
Main skill — all subsystems, state machine, scene assembly |
references/weather-shaders.md |
Complete GLSL/WGSL shaders for every effect |
references/weather-types.md |
12 weather state profiles, transition matrix, biome presets |
Quick Start Prompts
"Create a scene with gentle rain and ground fog"
"Bui
Related Skills
Procedural Grass Threejs
Generate procedural grass fields in Three.js using WebGPU compute with automatic WebGL2 fallback.
Procedural Landscapes Threejs
Generate procedural 3D landscapes and terrain in Three.js using WebGPU compute shaders with automatic WebGL2 f
Procedural Stars Threejs
Generate stunning procedural night skies, starfields, nebulae, and celestial phenomena in Three.js using WebGP
Procedural Clouds Threejs
Generate beautiful procedural clouds in Three.js using WebGPU raymarching with WebGL2 billboard/mesh fallbacks
Webgpu Claude Skill
A Claude skill for developing WebGPU applications with Three.js.
Threejs Hero Skill
Claude Code skill: build immersive Three.js landing pages as a single HTML file — foggy 3D world, DOM overlay,
Related Agents
Foundation Models
Specialist for Apple's Foundation Models framework and Apple Intelligence — on-device and Private Cloud Comput
3D Graphics Specialist
Use this agent when you need expertise in 3D rendering, geometry algorithms, WebGL optimization, or shader pro
Tron Integrator Trc20
Use when transferring, approving, or querying TRC-20 tokens (including USDT), estimating energy costs for TRC-
