mcpField
T
threejs-atmosphere-aerial-perspective

threejs-atmosphere-aerial-perspective

github.com/scottsttsCreative & media94699 installsUpdated 6d ago
Repository

About threejs-atmosphere-aerial-perspective

A Three.js skill for implementing atmospheric scattering and aerial perspective, from compact scenes to planetary and geospatial worlds. It emphasizes consistent scattering parameters and depth-aware composition.

Key features

  1. 01Analytic or LUT-based rendering tiers
  2. 02Sky radiance and sun transmittance
  3. 03Surface-segment transmittance and inscattering
  4. 04World-to-atmosphere scale conversion
  5. 05Depth-aware aerial perspective

Use cases

  1. 01Rendering sky and terrain haze consistently
  2. 02Building ground-to-space planetary views
  3. 03Adding aerial perspective to geospatial scenes
  4. 04Integrating atmosphere LUTs

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/scottstts/threejs-awesome-graphics-agent-skills --skill threejs-atmosphere-aerial-perspective

After installing, type/threejs-atmosphere-aerial-perspectivein Claude Code to confirm it loaded.

Bundled files

References and scripts installed along with SKILL.md.

agents/
openai.yaml
assets/lut-aerial-perspective/
irradiance.bin
irradiance.exr
THIRD_PARTY_LICENSES.md
transmittance.bin
transmittance.exr
examples/lut-aerial-perspective/
atmosphere-effect.js
examples/lut-aerial-perspective/source/atmosphere/
AerialPerspectiveEffect.ts
AtmosphereMaterialBase.ts
AtmosphereParameters.ts
blackBodyChromaticity.ts
celestialDirections.ts
constants.ts
getAltitudeCorrectionOffset.ts
getSunLightColor.ts
index.ts
IrradianceMaskPass.ts
PrecomputedTexturesLoader.ts
examples/lut-aerial-perspective/source/atmosphere/helpers/
functions.ts
sampleTexture.ts
examples/lut-aerial-perspective/source/atmosphere/shaders/
aerialPerspectiveEffect.frag
aerialPerspectiveEffect.vert
functions.glsl
index.ts
irradianceMask.frag
parameters.glsl
sky.frag
sky.glsl
sky.vert
stars.frag

Details

From the project README

Atmosphere and Aerial Perspective

Treat sky rendering and aerial perspective as two views of the same scattering model. They must share radii, density profiles, coefficients, sun direction, exposure scale, and coordinate transforms.

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.

Choose the implementation tier

  • Small scene with no orbital camera: analytic height/distance approximation.
  • Planetary ground-to-space camera: ray integration or precomputed LUTs.
  • Large geospatial world: LUTs plus world-to-planet transform, altitude correction, and depth-aware aerial perspective.

Read references/atmosphere-system-contract.md before implementation. It separates the LUT/ellipsoid architecture from dynamic integration and the shell/post handoff.

Read the LUT sky and aerial-perspective entry and its source/ modules for the SkyMaterial, SkyLightProbe, SunDirectionalLight, AerialPerspectiveEffect, precomputed-texture loader, sun/moon direction, lens flare, tone mapping, and dithering path used by the LUT example.

Required outputs

  • sky radiance;
  • sun transmittance/color;
  • segment transmittance from camera to visible surface;
  • segment inscattering;
  • optional sky irradiance for materials;
  • explicit scale conversion between world units and atmosphere units.

Failure conditions

  • sky and terrain haze use different sun directions or coefficients;
  • the atmosphere is a uniformly transparent sphere;
  • camera altitude is measured in a local flat frame during orbital motion;
  • scene depth is treated as linear when it is not;
  • exposure is used to hide incorrect radiance scale;
  • atmosphere fades abruptly at shell entry.

Routing boundary

This skill owns molecular/aerosol sky scattering and surface-segment aerial perspective. Use $threejs-volumetric-clouds for weather-shaped cloud density, temporal cloud reconstruction, and cloud shadows. Use $threejs-procedural-vfx for emissive aurora curtain volumes and their perspective/equirectangular radiance materials, and for standalone filmic HDR lens-flare compositors. Keep the LUT example's lens flare here when it remains one stage in the sky-scattering and aerial-perspective composition.

Comments

Markdown supported