Can't change light/dark mode of theme

Hello there,

I am using a theme with light and dark mode in the same file (Google Light and Dark Theme from HACS).
In my profile, I have no issue when manually switching between the light and the dark theme. See video with this link: screen-20230105-085247

However, When I use the frontend.set_theme service to change it programmatically, it does not work. I have set the theme to backend_selected in my profile, and set the mode to auto.
See issue in this video: screen-20230105-085149 → I try to switch from a blue theme to the light Google theme, but it does not work. It only works when I try to set it to dark mode.

What am I doing wrong ?
Thanks for your help,

Changing the mode of your theme to dark or light only changes the base colours that the theme uses - which you can then modify with your theme. Assigning a theme mode to dark or light does not mean the theme will be automatically selected when the viewing device enters dark mode. You still have to automate that yourself (I do it based on sunrise/sunset). See:

If you use a theme that changes all the colours there is no point setting a mode.

Thank you for your reply.
A few points are still not clear to me - many things are not very intuitive.
My theme has both a light and dark section, as described in the documentation you pointed.
The UI lets me select either the light or dark mode, regardless of the settings of the viewing device.
What I want to automate is the change of theme mode (light/dark) based on sunrise/sunset as well, regardless of the viewing device settings. If my phone OS is always in dark mode, I still want the HA interface to be white during the day and dark at night. But that does not work.
Is that possible or did I misunderstand something else ?

In that case you need to create two themes. One for light and one for dark. Forget assigning a mode, you don’t need it.

Set the theme in your profile to backend selected and automate the theme selection. I do it like this so I can change it from the frontend using the input select as well:

- id: 77c7bd23-41c5-492c-959c-a31f09527e24
  alias: 'Set Dark Theme At Sunset'
  - platform: sun
    event: sunset
    id: Night
  - platform: sun
    event: sunrise
    id: Day
  - service: input_select.select_option
      entity_id: input_select.select_theme
      option: "{{ }}"

- id: d5a5ea4d-b15c-44af-be3e-dc7b81f06d36
  alias: 'Select Theme'
  - platform: state
    entity_id: input_select.select_theme
    service: frontend.set_theme
      name: "{{ states('input_select.select_theme')|lower }}"
1 Like

Thank you, I will split my theme then.
Forgive me if I ask stupid questions but what’s the purpose of the mode option with the set_theme service then?

And can be switched by the device.