Lesson 4 of 13

Lights

Lights

MeshStandardMaterial and MeshPhongMaterial require lights — without them, objects appear black. MeshBasicMaterial and MeshNormalMaterial are unaffected by lights.

Types of Lights

AmbientLight — fills the whole scene uniformly. No direction, no shadows. Use it to prevent completely dark areas.

const ambient = new THREE.AmbientLight(0xffffff, 0.4);
scene.add(ambient);

DirectionalLight — parallel rays from one direction (like the sun). Creates shadows. Position determines direction.

const sun = new THREE.DirectionalLight(0xfff4cc, 2.0);
sun.position.set(5, 10, 5);
scene.add(sun);

PointLight — emits light in all directions from a single point (like a light bulb). Has range via distance.

const bulb = new THREE.PointLight(0xff8800, 3, 20);
bulb.position.set(0, 3, 0);
scene.add(bulb);

SpotLight — cone-shaped light with inner/outer angle (like a stage spotlight).

const spot = new THREE.SpotLight(0xffffff, 2, 30, Math.PI / 6);
spot.position.set(0, 10, 0);
scene.add(spot);

Color and Intensity

Light color multiplies with material color. White light (0xffffff) leaves material color unchanged. Intensity scales brightness.

const light = new THREE.DirectionalLight(0x4488ff, 1.5);
console.log(light.color.getHexString()); // "4488ff"
console.log(light.intensity);            // 1.5

Your Task

Implement createLightRig() that returns an object { ambient, directional } where:

  • ambient is an AmbientLight with color 0xffffff and intensity 0.3
  • directional is a DirectionalLight with color 0xffeedd and intensity 2, positioned at (5, 8, 5)
Three.js loading...
Loading...
Click "Run" to execute your code.