Detect Edge light/dark theme change

Question

Is there a way for a web page to detect when the theme in Microsoft Edge changes (Light/Dark)?

For example, if the application is running in high contrast I can use the -ms-hight-contrast to apply different CSS. For Edge Light/Dark theme, is there a similar media feature?

score 1 · Answer 1 · answered Sep 07 '18 at 01:43

To get the applied theme, Generally we can use Theme.getCurrent() method.

var getting = browser.theme.getCurrent(windowId) // integer

But at present, It is not supported by MS Edge.

Reference:

theme.getCurrent()

As an alternative way. With Javascript code you can try to access the registry key value to know which theme is applied currently.

You need to access value of key below.

HKEY_CURRENT_USER\SOFTWARE\Classes\Local Settings\Software\Microsoft\Windows\CurrentVersion\AppContainer\Storage\microsoft.microsoftedge_8wekyb3d8bbwe\MicrosoftEdge\Main

Theme DWORD

0 = light theme

1 = dark theme

To get the JavaScript example to access Registry key, You can refer link below.

Reference:

JScript/Javascript function to get a list of registry Values under Key

Note:- Many times this folder is not available in registry. User need to create it first. In that situation, This method will not work.

Regards

Deepak

Detect Edge light/dark theme change

1 Answers1