Home▸Colours & Light▸Light & Shadows

🌑 Light & Shadows

Move the light source and watch the shadows. Umbra and penumbra. Age: 8+

Colours & Light3DEasy60 FPS

🔦 Light & Shadows — Umbra & Penumbra

Explore how shadows form and why they have soft edges. With a small light source shadows are sharp; with a large one, a soft outer shadow (penumbra) surrounds the dark core (umbra).

🔬 What It Demonstrates

A point light source creates a sharp umbra. An extended source creates a penumbra — the region where only part of the source is blocked. This explains partial solar eclipses, soft photographic shadows, and why shadows are sharper on sunny than cloudy days.

🎮 How to Use

Drag objects between the light source and the wall. Change light source size to see the penumbra grow. Add multiple light sources for complex overlapping shadows.

💡 Did You Know?

During a total solar eclipse, the Moon's umbra is typically only 160 km wide on Earth's surface. Standing exactly in the umbra gives total darkness at midday; one step into the penumbra restores partial sunlight.

⚙ Under the hood

Move the light source and watch the shadow split into a sharp umbra and a soft penumbra. Ages 8+.

shadow simulationlight and shadowumbra penumbradirectional light

3D · Three.js / WebGL renderer · 60 FPS target · runs fully client-side, no install