THREE.JS / FOUNDATIONS — WEBGPU CUSTOM FOG

A valley keeps its secrets.

A bounded implementation of the official custom-fog contract: world-height pooling, two-octave procedural haze, distance fade, a sun-aligned key light, and deterministic terrain/forest proxies.

Initializing custom fog—

Preparing the TSL height band and forest proxy.

BACKEND: —
FOG BAND: —
SUN: —
FOREST: —
SEED / BUILDS: —
SAMPLE: —
BUILDS: —

Height-fog controlsTSL / REFERENCE

renderer target

fog base -2.0fog top 3.5distance haze 0.018sun elevation 11.0sun azimuth 150 animate procedural haze

Custom fog contract

Native WebGPU assigns scene.fogNode from `fog(groundColor, fogArea)` where `fogArea` combines a world-height band, two triNoise3D octaves, and densityFogFactor distance haze. WebGL2 keeps an explicit FogExp2 reference.

Derived from the pinned official WebGPU custom fog example. This bounded study uses deterministic local proxy terrain/forest geometry and does not claim 500,000-tree scale, SkyMesh/PMREM baking, Inspector/FirstPersonControls presentation, exact page/pixels, or whole-example fidelity.