DEV Community

Discussion on: Enabling Dark Mode On Websites Based On Surrounding Light

Collapse
 
andy profile image
Andy Zhao (he/him)

WHAT THE HECK that's amazing! I wonder how the browser detects the light???

Collapse
 
link2twenty profile image
Andrew Bone

It relies on the device having a sensor.

developer.mozilla.org/en-US/docs/W...

Collapse
 
andy profile image
Andy Zhao (he/him)

Ah, okay. For some reason I thought it was solely based on software.

Collapse
 
ananyaneogi profile image
Ananya Neogi

It is based on the Sensors API.
Also, to use this sensor, browser needs permission from the user, that is done via the Permissions API.

Collapse
 
sauloco profile image
Saulo Vargas

Usually cellphones or some notebooks have hardware to detect light and auto-adjust brightness, so it can be used for this.

Collapse
 
ananyaneogi profile image
Ananya Neogi

Yes, this is based on the sensors that are present on your device. The Sensors API exposes those device sensors on to the web platform.