HomeColours & LightLighting Design Studio

Lighting Design Studio

Interactive 3D lighting design studio: place up to three fixtures of adjustable color temperature and intensity in a room, watch shadows soften or sharpen, and read the inverse-square illuminance at a floor sensor in real time.

Colours & Light3DEasy60 FPS
lighting-design ↗ Open standalone

Lighting design is about far more than switching a bulb on — it is the deliberate placement of sources with the right intensity, color temperature and spread to serve both function and mood. This simulator builds a small three-point-lit room: a key, fill and accent fixture, each individually toggleable, each tunable in intensity and color temperature. A sensor disc on the floor measures the illuminance actually landing on it in lux, following the inverse-square law, and reports the intensity-weighted correlated color temperature of the mixed light. A softness control approximates fixture size, from a crisp pinpoint source to a large diffuse panel, showing how shadow edges blur as the effective source grows. Toggle fixtures, drag the temperature slider from warm incandescent to cool daylight, and watch how both the numbers and the rendered room respond together.

⚙ Under the hood

Interactive 3D lighting design studio: place up to three fixtures of adjustable color temperature and intensity in a room, watch shadows soften or sharpen, and read the inverse-square illuminance at a floor sensor in real time.

Three.jslighting-designcolor-temperatureilluminanceshadowsinterior-design

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

What did you find?

Add reproduction steps (optional)