🖼️ WallPanel Addon - Wall panel mode for your Home Assistant Dashboards

I have not tried it. But it looks like the fab-card might do what you are after.

Floating Action Button (card) - Share your Projects! / Dashboards & Frontend - Home Assistant Community

Yes, you can use wallpanel in combination with [ lovelace-digital-clock](GitHub - wassy92x/lovelace-digital-clock: A custom digital clock card for Home Assistant).
Example wallpanel configuration:

wallpanel:
  enabled: true
  style:
    wallpanel-screensaver-info-box:
      '--wp-card-width': 200px
      transform: scale(2)
    wallpanel-screensaver-info-box-content:
      '--ha-card-background': none
      '--ha-card-box-shadow': none
      '--ha-card-border-width': 0px
  info_animation_duration_x: 20
  info_animation_duration_y: 10
  info_animation_timing_function_x: ease-in-out
  info_animation_timing_function_y: ease-in-out
  show_images: false
  cards:
    - type: custom:digital-clock
      dateFormat: " "
      timeFormat:
        hour: 2-digit
        minute: 2-digit

This actually works great! Exactly what I was looking for.

Thanks much!

Question, Is there any way to change the font color of the digital clock in this use case? Even though this screensaver works well, the text is super bright! Would like to use a gray color so it’s less on the eyes at night.

Which option do i have to add for blurring a photo in the background when it’s in portrait mode?

Hi, since update update 4.30 (i believe and yes i know it is more than 6 months ago :slight_smile: ) the configured cards for the Wall Panel add on are not visable anymore. Tonight i’ve finaly made time te check, but with no result. The strange thing is that after tweaking my custom CSS i noticed that only de left 500px is visable and everything above is not. For example the attached screenshot. The date used to be centered.

Does anyone have a clue?

kinds regards,

Thomas

Finally fixed it by adding a css position line to it.

wallpanel:
  enabled: true
  hide_sidebar: true
  image_url: >-
    https://www.thegef.org/sites/default/files/styles/banner_image/public/2022-03/forests-1440x655.jpg?h=4e9a1ef8&itok=etq1Og--
  cards:
    - type: custom:digital-clock
      dateFormat:
        weekday: long
        day: 2-digit
        month: long
      timeFormat:
        hour: 2-digit
        minute: 2-digit
      card_mod:
        style: |
          ha-card {
           text-align: center!important;
           font-weight: 300!important;
           font-size: 50px;
           padding: 0px 0px;
           background: transparent;
           border: 0px;
           color: rgb(255, 255, 255);
           left: 425px;
           top: 250px;
           width: 1000px;
           position: absolute;
          }    
    - type: custom:weather-card
      entity: weather.forecast_thuis
      name: Buckwheat
      card_mod:
        style: |
          ha-card {
          font-size: 13px;
          background: rgb(0, 0, 0, 0.6);
          position: absolute!important;
          left: 1350px;
          top: 850px;
          }

not sure if i’m overruling something faulty in my code, but it works. If anyone has a better suggestion, please let me know there i want my code as clean as possible for future upgrades.

Do I have to run traefik to make this work? I don’t quite understand why I would need traefik of my immich and WallPanel were on the same subnet? Is it because it’s being run in docker?

No but its a common way for many. When you’re using wall panel your browser is connected to an URL, f.ex: www.hainstance.net but then to get the images from immich it needs to contact immich on another URL f.ex www.immich.net, this is a security risk and is blocked by the browser unless cors-headers are setup.

If you only run home-assistant locally (or need the dashboard accessed locally) AND you host both home-assistant and immich on the same server (the same ip/url) you can probably avoid setting up cors (but im not 100% sure if this is the case since the ports will still differ for a basic setup).

Just a heads up, the new core immich integration (HA 2025.6.0 or later) provides a media-source url for your immich albums. This means you can set wallpanel to use your immich albums via media-source. The immich integration can connect to your immich server via local IP, so that means no SSL, no cors, no extra config for wall panel/immich. I’m using it now. Simple and works great. @diode @dmncr