Hello,
This is my first attempt of making my own theme. But it seems like I’ve started on the wrong foot. I want to make a dark one, based on default (and only change some items, like borders and such). Although I’ve setup “mode: dark” in the theme yaml, when I apply it, it stays on light mode, and there is no option to switch between light or dark.
Can somebody tell me what am I doing wrong in here? How do I set it so that’s using the default dark mode?
Thanks in advance!
By default, any theme is ‘based on’ the standard theme. Any CSS variables specified in the theme will be used, where they aren’t the standard CSS variables will be used.
I don’t recognise base_theme, I like what I think it should do, is it a thing, is it documented anywhere?
To use dark mode any specific CSS variables for dark mode need to be indented under mode: dark, there must be at least one or it doesn’t work. When in dark mode CSS variables will be applied in the following order : dark mode specific => your theme => ha standard
So, indent at least one of your CSS variables to make it specific to dark mode, or add something new there.
Once you’ve done that you will need to remember to call frontend.reload_themes in developer tools / services.
Home Assistant Frontend - Home Assistant (home-assistant.io)
