Can I use a service call to switch between light and dark mode introduced in 0.114?

I am running 0.114.0b2. It is great to see that finally a dark theme is now built into the UI. Currently I don’t have any themes setup configuration.yaml.

The user interface has options for “Auto” “Light” and “Dark”. I suppose auto is only for android, Windows 10 or an operating system that has a toggle for dark mode. However I don’t have any android devices that switch into dark mode, and my linux desktop doesn’t have any way of telling Chrome to enter a dark mode, so auto will be always useless for my setup.

Is there a way, to use frontend.set_theme to get the browser to switch into dark or light mode so I can build it into an automation to do something like switch into dark mode between sunset and sunrise? I think the way the service call is implemented it can only tell the light or dark mode be a certain previously installed custom theme, not instruct the browser to switch between light and dark.

Alternately does anyone simply have the yaml configuration of the default “dark” theme that exists in polymer that I can paste into the themes: section of frontend:. I think the default dark theme looks good enough and would like to set that as custom theme.

Not using the beta, but can you just make the name of the theme “Dark”?

Beta questions go in the beta discord.

But in reply to your question. Yes there is a way and it is mentioned in the release notes.

For custom themes, there is a new option on the set_theme service call, mode: 'dark' ; this allows to set a theme that will be used when your device is in dark mode.

I think this is a misconception.
the mode:dark parameter does NOT activate dark mode on e.g. Android 10 or 11. The mode of an Android device is selected in its settings.
What the above parameter does is: It defines the theme that the mobile will use when it uses “dark mode” through its own settings. Hence a set_theme service call with mode:dark parameter does not at all change whether the Android device uses dark mode or light mode. It simply defines, which template the device should use if in dark mode.

The question of the OP is very valid. I experimented my ass of and I did not succeed in reliably setting the HA frontend on an Android 10 device to light or to dark since the new mode param exists in HA.

1 Like

Yeah you’re right. I had this clarified for me on discord ages ago. It does indeed work the other way round.

I guess this is the solution…

Mode defaults to light. It’s more like:

name: none
mode: dark
name: My Theme

No sorry, this is not correct.
If you want to disable the dark mode theme, you have to set the name to “none” not to nothing.
Also you don’t know, which state your Android device is in, dark or light. If you want to make sure that none of the two states overrides the theme you set with your step 2 you have to set the templates for BOTH modes to “none”. Which brings you exactly back to my solution.

The first one sets the dark mode to none. The second one sets the light mode to your theme, and since no dark theme is set, it’ll default to the light theme.

@KTibow I checked again and you are correct! If no dark mode theme is set, Android defaults to the light theme! So if I get this correctly a set_theme without mode is identical to a set_theme with mode:light.

@KTibow are you by any chance aware of a method to access the default dark theme of HA, but set it arbitrarily through set_theme service calls?

theme: default

should work I think

Sorry for a bit offtopic here, hopefully not spamming too much. Anyone knows if it’s possible to specify a default dark and default light theme to be applied by HA automatically when the operating system’s theme changes on the device running HA application??

I just want to have a bit customized version of the default themes, but I didn’t find a way to ‘tell’ HA to use another theme automatically when it switches to dark from light and the other way around. The default themes are always used.

If you’re also interested in such behaviour - please vote for my feature request here: Ability to specify default light and dark modes

I believe that functionality has been in there for a while. It works just fine for me. Here’s an example service call to use the theme default_dark_custom if the OS uses dark mode:

name: default_dark_custom
mode: dark
1 Like

Spot on! Thanks. I saw the description, but I think it’s a bit unclear. So it’s possible to set it as I want and then set ‘Backend selected’ in my user profile and it works automatically, which is a bit weird and surprising, but it works (backend-selected theme selected by frontend :wink: ).

When you call the service, it actually sets a file in .storage.