Introduction

angular-three-soba/staging provides components for staging, environment, lighting, and visual effects in your 3D scenes.

Peer Dependencies

Package	Required By
@pmndrs/vanilla	Various staging utilities
three-mesh-bvh	NgtsCaustics
@monogrid/gainmap-js	HDR environment maps

npm install @pmndrs/vanilla three-mesh-bvh @monogrid/gainmap-js
# yarn add @pmndrs/vanilla three-mesh-bvh @monogrid/gainmap-js
# pnpm add @pmndrs/vanilla three-mesh-bvh @monogrid/gainmap-js

Shadows

• NgtsAccumulativeShadows - Soft shadows with zero performance impact after accumulation
• NgtsRandomizedLights - Randomized lights for realistic raycast-like shadows
• NgtsContactShadows - Contact shadow implementation

Environment & Lighting

• NgtsEnvironment - Global cubemap for scene environment and background
• NgtsLightformer - Flat shapes mimicking light-formers for HDRI environments
• NgtsSky - Procedural sky dome using atmospheric scattering
• NgtsSpotLight - Enhanced spot light with volumetric lighting
• NgtsSpotLightShadow - Shadow caster with texture patterns
• NgtsCaustics - Realistic caustic light patterns

Positioning & Layout

• NgtsCenter - Center children based on bounding box
• NgtsBBAnchor - Offset children using AABB bounding boxes
• NgtsBounds - Calculate boundary box and center camera

Animation & Effects

• NgtsFloat - Simulate floating objects with up/down motion
• NgtsCameraShake - Configurable camera shake effect
• NgtsSparkles - Animated sparkle particles

Clouds & Atmosphere

• NgtsCloud - Volumetric clouds using instanced billboarded sprites
• NgtsClouds - Container for multiple cloud instances

Textures

• matcapTextureResource - Load matcap textures for realistic lighting without lights
• normalTextureResource - Load normal textures for surface detail
• NgtsRenderTexture - Render a live scene into a texture

Masking

• NgtsMask - Create stencil masks for selective rendering

Stage & Presentation

• NgtsStage - Complete stage setup with lighting, shadows, and environment
• NgtsBackdrop - Curved plane for studio-like backdrop
• NgtsShadow - Simple circular drop shadow