Light
Quick answer
Light is the base class for every three.js light source, providing color, intensity, castShadow, shadow, and visible. Subclasses such as DirectionalLight, PointLight, SpotLight, and AmbientLight define how illumination is computed and which parameters matter. Set visible to false to disable a light without removing it from the scene.
new THREE.Light ( color , intensity ) → Light
Key points
- intensity units differ per type; physical rendering makes sun values of 2 to 4 reasonable.
- shadow.mapSize, shadow.camera, and shadow.bias configure shadow quality and coverage.
- Toggling visible is cheaper than adding or removing lights repeatedly.
Example
const sun = new THREE.DirectionalLight(0xfff0d8, 2.4);
sun.position.set(20, 30, 12);
sun.target.position.set(0, 0, 0);
scene.add(sun.target);
sun.castShadow = true;
sun.shadow.mapSize.set(2048, 2048);
sun.shadow.camera.left = -40;
sun.shadow.camera.right = 40;
sun.shadow.camera.top = 40;
sun.shadow.camera.bottom = -40;
sun.shadow.camera.near = 1;
sun.shadow.camera.far = 120;
sun.shadow.bias = -0.0005;
sun.shadow.normalBias = 0.02;
scene.add(sun);const lamp = new THREE.PointLight(0xffd7a8, 60, 18, 2);
lamp.position.set(3, 4.5, 0);
scene.add(lamp);
const spot = new THREE.SpotLight(0xffffff, 90, 40, Math.PI / 7, 0.4, 2);
spot.position.set(0, 12, 6);
spot.target.position.set(0, 0, 0);
scene.add(spot, spot.target);Notes
- Adding or removing lights recompiles materials and causes frame hitches; prepare lights up front.
- AmbientLight has no direction and cannot fill in for a missing key light.
English edition written for Atlaslog. Code is taken from the original Chinese page and runs unchanged.
Atlaslog (2026). Light. https://www.jingweizhi.com/en/three/api/light.html (accessed 2026-11-03).