Dynamic light mode / dark mode - how?

v6
3

Thanks for the response; very helpful. It looks like in every browser we care about, there’s the ability to listen for the media change:

So in theory, at least, we should be able to do something like:

window.matchMedia('(prefers-color-scheme: dark)')
      .addEventListener('change', event => {
  if (event.matches) {
    //dark mode
  } else {
    //light mode
  }
})

And thus know when the device has auto-switched modes and it’s time to reconfigure. Will give this a try.

1 Like