Jpeg file path for themes backrgound

Hello all,

I’m running Home Assistant OS on RPi4 and I’m stuck on a problem which seems quite dumb but I do not find any answer on any forum. In addition, I use lovelace-ui as my panel graphical manager.

In short, I have managed to make a new theme, which is working pretty fine but I’m not able to add a background image by referring to the file path.

As a prerequisite, I do confirm :

  • In the lovelace panel code, I’ve added background: var(--backrgound-image) so that I can refer to the background-image variable in my theme YAML to have a background image dedicated to my theme.
  • In the configuration.yaml, I have added the configuration needed to add the themes folder :
  themes: !include_dir_merge_named themes

I know that both parameters are ok since I’m able to copy a generic theme with a background which is working fine. The sample theme I use is using a pre-encoded b64 image into the YAML file.
The goal here is to be able to change the pre-encoded b64 with another jpeg file on the Home Assistant instance.

To go deep into details :

  • I have used SSH Plugin or VS Code plugin to push or create my themes file.
  • The path of the theme is :
  • I pushed an image on :

Inside my YAML theme file if I do :
background-image: "center / cover no-repeat fixed url('/config/themes/my-theme/image.jpeg')"
==> Image do NOT show.

If I use a base 64 encoder to encode my image and change the YAML theme file to :
background-image: "center / cover no-repeat fixed url('data:image/jpeg;base64,.......')"
==> Image is shown without problem

When I check the log viewer or the log in my browser side, I do not see any error when I use the file path.
Can someone confirm me if the way I do it is OK or not, and how I can have a file path which is available for Home Assistant to use for panel rendering.