THREE.JS / FOUNDATIONS — WEBGPU CUSTOM FOG BACKGROUND
Depth dissolves into blue.
A focused implementation of the official post-processing contract: scene pass, view-Z range fog, tone-mapped scene color, fog-color mix, and a color-transforming RenderPipeline output.
Initializing custom fog background—
Preparing the pass graph and local proxy scene.
Study issue
- BACKEND
- —
- PIPELINE
- —
- FOG RANGE
- —
- SCENE
- —
- STATE
- —
- SAMPLE
- —
Post-process controlsTSL / REFERENCE
Custom fog background contract
Native WebGPU assigns RenderPipeline.outputNode to rangeFogFactor(near, far).context({ getViewZ }) mixed between the tone-mapped scene pass and the fog color. The WebGL2 lane keeps an explicit THREE.Fog reference.
Derived from the pinned official WebGPU Custom Fog Background example. This bounded study uses deterministic local proxy geometry and does not claim the official UltraHDR environment, DamagedHelmet asset, exact page/pixels, Inspector presentation, arbitrary device/performance coverage, or whole-example fidelity.