Light Estimation

Light Estimation refers to the ability to estimate the lighting conditions of the real world within an augmented/mixed reality environment. It allows virtual objects to interact with the real-world lighting environment, making them appear more naturally integrated.


In this example, a black cat is sitting on the ground while its shadow is cast onto the surface by the surrounding natural light when viewed in XR. Outside of XR, the scene uses a default light source.

📱
To experience the following example, a WebXR-compatible mobile device is required.
const xrExperience = useXrExperience();
 
useEffect(() => {
    const lightEstimation = xrExperience.baseExperience.featuresManager.enableFeature(WebXRLightEstimation.Name, 'latest', {
        createDirectionalLightSource: true,
    }) as WebXRLightEstimation;
}, []);

Video captured with Samsung Galaxy S24.


Learn More

For advanced use cases and customizations, please refer to Babylon.js documentation: https://doc.babylonjs.com/features/featuresDeepDive/webXR/webXRARFeatures/#webxr-light-estimation.