I have not tried it. But it looks like the fab-card might do what you are after.
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 ) 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