
You can see a high resolution animated gif here
Hi everybody, just wanted to share my custom card dashboard used in my house. It sits on a tablet plugged on the wall and used to turn lights and stuff in the house.
Way too many hours into this. Some notable things it does:
- Background changes based on weather
- I snapped a picture of each room and made this 3-floors house plan
- I basically made the design in… powerpoint. The version with “lights on” is not a camera. Is just the same picture but with an “internal glow” in yellow
- Added some temperature/moisture sensors and also created custom sensors for badges showing comfort level in the rooms (heat is either cold, good or hot (blue, green, red) the humidity is either good, wet or dry (green, blue, orange) - I live in Holland. It will never be dry…
- Each room has a generic thermostat linked to evohome radiator thermostats via a xiaomi temperature sensor
- The thermostats also show off (grey), idle (blue) or requesting heat (red)
- Added “quick warm me” buttons which turn on/off
- I’ve added quick actions on the rights for various things and scenes
- Added also the garden lights and lantarn
- There’s a cat-door sensor (xiaomi open/close) which calculate how often the cat used it each day
- Added a covid infection count per day
- and a memory usage sensor (I had lots of drama around this with my RPI4)
- It’s using from HACS: Browser_mod, card-mod, Lovelace Card Templater, Kiosk Mode, Text Element and min-graph-card
Happy to share some code - ping me if you are interested
Lovelace Dashboard
type: picture-elements
elements:
- type: image
entity: light.closet
tap_action:
action: toggle
state_image:
'on': /local/001ClosetON.png
'off': /local/001ClosetOFF.png
style:
top: 19.1%
left: 14.6%
width: 21%
- type: image
entity: light.office
tap_action:
action: toggle
hold_action:
action: call-service
service: light.catturn_on
service_data:
entity_iccomputat.pd: light.office
brightness_pct: 100
state_image:
'on': /local/002OfficeON.png
'off': /local/002OfficeOFF.png
style:
top: 19.1%
left: 39.2%
width: 28.3%
- type: image
entity: light.sleeping_room
tap_action:
action: toggle
state_image:
'on': /local/003SleepingRoomON.png
'off': /local/003SleepingRoomOFF.png
style:
top: 19%
left: 69.6%
width: 32.7%
- type: image
entity: light.kitchen
tap_action:
action: toggle
hold_action:
action: call-service
service: light.turn_on
service_data:
entity_id: light.kitchen
brightness_pct: 100
state_image:
'on': /local/004KitchenON.png
'off': /local/004KitchenOFF.png
style:
top: 54.4%
left: 13.8%
width: 22.3%
- type: image
entity: light.toilet
tap_action:
action: toggle
state_image:
'on': /local/005PantryON.png
'off': /local/005PantryOFF.png
style:
top: 54.4%
left: 30.7%
width: 11.5%
- type: image
entity: light.dining_room
tap_action:
action: toggle
hold_action:
action: call-service
service: light.turn_on
service_data:
entity_id: light.dining_room
brightness_pct: 100
state_image:
'on': /local/006DiningON.png
'off': /local/006DiningOFF.png
style:
top: 54.4%
left: 45.05%
width: 17.2%
- type: image
entity: light.cozy
tap_action:
action: toggle
hold_action:
action: call-service
service: light.turn_on
service_data:
entity_id: light.cozy
brightness_pct: 90
state_image:
'on': /local/008CozyON.png
'off': /local/008CozyOFF.png
style:
top: 56%
left: 65.65%
width: 24%
- type: image
entity: light.livingroom
tap_action:
action: toggle
hold_action:
action: call-service
service: light.turn_on
service_data:
entity_id: light.livingroom
brightness_pct: 100
state_image:
'on': /local/007LivingRoomON.png
'off': /local/007LivingRoomOFF.png
style:
top: 42%
left: 65.65%
width: 24%
- type: image
entity: light.hall
tap_action:
action: toggle
state_image:
'on': /local/009HallON.png
'off': /local/009HallOFF.png
style:
top: 54.4%
left: 82.6%
width: 9.95%
- type: image
entity: light.kelder
tap_action:
action: toggle
state_image:
'on': /local/010KelderON.png
'off': /local/010KelderOFF.png
style:
top: 84.4%
left: 9.8%
width: 14.4%
- type: image
entity: light.workshop_lights
tap_action:
action: toggle
state_image:
'on': /local/011WorkshopON.png
'off': /local/011WorkshopOFF.png
style:
top: 84.46%
left: 23.4%
width: 13.71%
- type: image
entity: light.was
tap_action:
action: toggle
state_image:
'on': /local/012WasON.png
'off': /local/012WasOFF.png
style:
top: 84.4%
left: 36.3%
width: 12.7%
- type: image
entity: light.storage
tap_action:
action: toggle
state_image:
'on': /local/012StorageON.png
'off': /local/012StorageOFF.png
style:
top: 84.4%
left: 49%
width: 13%
- type: image
entity: light.bathroom
tap_action:
action: toggle
state_image:
'on': /local/014BathroomON.png
'off': /local/014BathroomOFF.png
style:
top: 84.4%
left: 64.5%
height: 16.95%
- type: image
entity: light.garden_room
tap_action:
action: toggle
state_image:
'on': /local/013GardenRoomON.png
'off': /local/013GardenRoomOFF.png
style:
top: 84.4%
left: 82.4%
width: 19.5%
- type: image
entity: light.street
tap_action:
action: toggle
state_image:
'on': /local/015FrontDoorON.png
'off': /local/015FrontDoorOFF.png
style:
top: 35.1%
left: 88.1%
width: 11%
- type: image
entity: light.garden
tap_action:
action: toggle
state_image:
'on': /local/020gardenlightON.png
'off': /local/020gardenlightOFF.png
style:
top: 85.2%
left: 96.6%
width: 4%
- type: state-badge
entity: sensor.dark_sky_apparent_temperature
style:
top: 12%
left: 4%
font-size: 135%
font-weight: bold
color: 'rgba(0,0,0,0)'
- type: state-label
entity: sensor.simple_time_date
style:
top: 2.5%
left: 44%
font-size: 211%
font-weight: bold
text-shadow: 3px 3px 2px black
color: '#FFFFFF'
- type: image
entity: input_boolean.imhome
tap_action:
action: toggle
hold_action:
action: call-service
service: input_boolean.toggle
service_data:
entity_id: input_boolean.imhome
state_image:
'on': /local/ButtonHome.png
'off': /local/ButtonHomeOFF.png
style:
top: 8.7%
left: 94.5%
width: 9.8%
- type: image
entity: light.all
tap_action:
action: toggle
state_image:
'on': /local/ButtonLights.png
'off': /local/ButtonLightsOFF.png
style:
top: 16.7%
left: 94.5%
width: 9.8%
- type: image
tap_action:
action: call-service
service: script.offbed
image: /local/ButtonBed.png
style:
top: 24.6%
left: 94.5%
width: 9.8%
- type: image
tap_action:
action: call-service
service: scene.turn_on
service_data:
entity_id: scene.watching_tv
image: /local/ButtonTVOFF.png
style:
top: 32.7%
left: 94.5%
width: 9.8%
- type: image
entity: switch.computer
tap_action:
action: toggle
hold_action:
action: call-service
service: input_boolean.toggle
service_data: input_boolean.computer_on_off
state_image:
'on': /local/ButtonComputerON.png
'off': /local/ButtonComputerOFF.png
style:
top: 40.7%
left: 94.5%
width: 9.8%
- type: image
entity: input_boolean.sky_radio_toggle
tap_action:
action: toggle
hold_action:
action: call-service
service: input_boolean.toggle
service_data: input_boolean.sky_radio_toggle
state_image:
'on': /local/ButtonRadio.png
'off': /local/ButtonRadioOFF.png
style:
top: 48.7%
left: 94.5%
width: 9.8%
- type: image
entity: input_boolean.away
tap_action:
action: toggle
hold_action:
action: call-service
service: input_boolean.toggle
service_data:
entity_id: input_boolean.away
state_image:
'on': /local/ButtonAway.png
'off': /local/ButtonAwayOFF.png
style:
top: 56.7%
left: 94.5%
width: 9.8%
- type: conditional
conditions:
- entity: person.asmert
state: home
elements:
- type: image
image: /local/ButtonAsmeret.png
tap_action:
action: call-service
service: device_tracker.see
service_data:
dev_id: asmert
location_name: not_home
style:
top: 36.9%
left: 6.9%
width: 10%
- type: conditional
conditions:
- entity: person.asmert
state: not_home
elements:
- type: image
image: /local/ButtonAsmeretOFF.png
tap_action:
action: call-service
service: device_tracker.see
service_data:
dev_id: asmert
location_name: home
style:
top: 36.9%
left: 6.9%
width: 10%
- type: image
entity: switch.warmer
tap_action:
action: toggle
state_image:
'on': /local/ButtonWarmerON.png
'off': /local/ButtonWarmertOFF.png
style:
top: 74.05%
left: 55%
width: 10%
- type: image
entity: switch.warmeroffice
tap_action:
action: toggle
state_image:
'on': /local/ButtonWarmerON.png
'off': /local/ButtonWarmertOFF.png
style:
top: 36.7%
left: 40.5%
width: 10%
- type: image
image: /local/thermo/title_kast.png
style:
top: 30%
left: 10%
- type: image
image: /local/thermo/title_kantoor.png
style:
top: 30%
left: 36%
- type: image
entity: sensor.badge_office_image
state_image:
hotnat: /local/thermo/badge_sensor_hotnat.png
hotok: /local/thermo/badge_sensor_hotok.png
hotdroog: /local/thermo/badge_sensor_hotdroog.png
oknat: /local/thermo/badge_sensor_oknat.png
okok: /local/thermo/badge_sensor_okok.png
okdroog: /local/thermo/badge_sensor_okdroog.png
koudnat: /local/thermo/badge_sensor_koudnat.png
koudok: /local/thermo/badge_sensor_koudok.png
kouddroog: /local/thermo/badge_sensor_kouddroog.png
style:
top: 28.5%
left: 38.7%
- type: state-label
entity: sensor.badge_office
style:
top: 26.5%
left: 38.7%
font-size: 170%
text-shadow: 3px 3px 2px black
- type: image
entity: sensor.therm_img_office
image: /local/thermo/thermostat.png
state_image:
heating: /local/thermo/thermostatON.png
idle: /local/thermo/thermostatOFF.png
style:
top: 28%
left: 48.5%
- type: state-label
entity: sensor.therm_office
tap_action:
action: none
style:
top: 27.8%
left: 48.4%
font-size: 170%
text-shadow: 3px 3px 2px black
- type: image
entity: climate.office
image: /local/thermo/thermostatinvisible.png
tap_action:
action: more-info
style:
top: 28%
left: 48.5%
- type: image
image: /local/thermo/title_slaapkamer.png
style:
top: 30%
left: 65%
- type: image
entity: sensor.badge_sleeping_room_image
state_image:
hotnat: /local/thermo/badge_sensor_hotnat.png
hotok: /local/thermo/badge_sensor_hotok.png
hotdroog: /local/thermo/badge_sensor_hotdroog.png
oknat: /local/thermo/badge_sensor_oknat.png
okok: /local/thermo/badge_sensor_okok.png
okdroog: /local/thermo/badge_sensor_okdroog.png
koudnat: /local/thermo/badge_sensor_koudnat.png
koudok: /local/thermo/badge_sensor_koudok.png
kouddroog: /local/thermo/badge_sensor_kouddroog.png
style:
top: 28.5%
left: 70.5%
- type: state-label
entity: sensor.badge_sleeping_room
style:
top: 26.5%
left: 70.5%
font-size: 170%
text-shadow: 3px 3px 2px black
- type: image
entity: sensor.therm_img_sleeping_room
image: /local/thermo/thermostat.png
state_image:
heating: /local/thermo/thermostatON.png
idle: /local/thermo/thermostatOFF.png
style:
top: 28%
left: 79.1%
- type: state-label
entity: sensor.therm_sleeping_room
tap_action:
action: none
style:
top: 27.8%
left: 79%
font-size: 170%
text-shadow: 3px 3px 2px black
- type: image
entity: climate.sleepingom
image: /local/thermo/thermostatinvisible.png
tap_action:
action: more-info
style:
top: 28%
left: 79.1%
- type: image
image: /local/thermo/title_keuken.png
style:
top: 68%
left: 11%
- type: image
entity: sensor.badge_kitchen_image
state_image:
hotnat: /local/thermo/badge_sensor_hotnat.png
hotok: /local/thermo/badge_sensor_hotok.png
hotdroog: /local/thermo/badge_sensor_hotdroog.png
oknat: /local/thermo/badge_sensor_oknat.png
okok: /local/thermo/badge_sensor_okok.png
okdroog: /local/thermo/badge_sensor_okdroog.png
koudnat: /local/thermo/badge_sensor_koudnat.png
koudok: /local/thermo/badge_sensor_koudok.png
kouddroog: /local/thermo/badge_sensor_kouddroog.png
style:
top: 66%
left: 16.3%
- type: state-label
entity: sensor.badge_kitchen
style:
top: 64%
left: 16.1%
font-size: 170%
text-shadow: 3px 3px 2px black
- type: image
entity: sensor.therm_img_kitchen
image: /local/thermo/thermostat.png
state_image:
heating: /local/thermo/thermostatON.png
idle: /local/thermo/thermostatOFF.png
style:
top: 62%
left: 7.5%
- type: state-label
entity: sensor.therm_kitchen
tap_action:
action: none
style:
top: 62%
left: 7.4%
font-size: 170%
text-shadow: 3px 3px 2px black
- type: image
entity: climate.kitchen
image: /local/thermo/thermostatinvisible.png
tap_action:
action: more-info
style:
top: 56%
left: 7.4%
- type: image
image: /local/thermo/title_wc.png
style:
top: 68%
left: 31%
- type: image
entity: sensor.therm_img_wc_woonkame
image: /local/thermo/thermostat.png
state_image:
heating: /local/thermo/thermostatON.png
idle: /local/thermo/thermostatOFF.png
style:
top: 62%
left: 31%
- type: state-label
entity: sensor.therm_wc
tap_action:
action: none
style:
top: 62%
left: 31%
font-size: 170%
text-shadow: 3px 3px 2px black
- type: image
entity: climate.wc_woonkame
image: /local/thermo/thermostatinvisible.png
tap_action:
action: more-info
style:
top: 56%
left: 31%
- type: image
image: /local/thermo/title_eetkamer.png
style:
top: 68%
left: 44.8%
- type: image
image: /local/thermo/title_woonkamer.png
style:
top: 68%
left: 64.5%
- type: image
entity: sensor.badge_living_room_image
state_image:
hotnat: /local/thermo/badge_sensor_hotnat.png
hotok: /local/thermo/badge_sensor_hotok.png
hotdroog: /local/thermo/badge_sensor_hotdroog.png
oknat: /local/thermo/badge_sensor_oknat.png
okok: /local/thermo/badge_sensor_okok.png
okdroog: /local/thermo/badge_sensor_okdroog.png
koudnat: /local/thermo/badge_sensor_koudnat.png
koudok: /local/thermo/badge_sensor_koudok.png
kouddroog: /local/thermo/badge_sensor_kouddroog.png
style:
top: 66%
left: 69.8%
- type: state-label
entity: sensor.badge_living_room
style:
top: 64%
left: 69.6%
font-size: 170%
text-shadow: 3px 3px 2px black
- type: image
entity: sensor.therm_img_living_room
image: /local/thermo/thermostat.png
state_image:
heating: /local/thermo/thermostatON.png
idle: /local/thermo/thermostatOFF.png
style:
top: 62%
left: 60.5%
- type: state-label
entity: sensor.therm_living_room
tap_action:
action: none
style:
top: 62%
left: 60.4%
font-size: 170%
text-shadow: 3px 3px 2px black
- type: image
entity: climate.living_room
image: /local/thermo/thermostatinvisible.png
tap_action:
action: more-info
style:
top: 56%
left: 60.4%
- type: image
image: /local/thermo/title_gang.png
style:
top: 68%
left: 82.8%
- type: state-label
entity: sensor.badge_hall
style:
top: 67.3%
left: 84%
font-size: 100%
text-shadow: 3px 3px 2px black
- type: image
entity: sensor.therm_img_hall
image: /local/thermo/thermostat.png
state_image:
heating: /local/thermo/thermostatON.png
idle: /local/thermo/thermostatOFF.png
style:
top: 62%
left: 82.8%
- type: state-label
entity: sensor.therm_hall
tap_action:
action: none
style:
top: 62%
left: 82.7%
font-size: 170%
text-shadow: 3px 3px 2px black
- type: image
entity: climate.hall
image: /local/thermo/thermostatinvisible.png
tap_action:
action: more-info
style:
top: 56%
left: 82.7%
- type: image
image: /local/thermo/title_kelder.png
style:
top: 88.5%
left: 4%
- type: image
entity: sensor.badge_kelder_image
state_image:
hotnat: /local/thermo/badge_sensor_hotnat.png
hotok: /local/thermo/badge_sensor_hotok.png
hotdroog: /local/thermo/badge_sensor_hotdroog.png
oknat: /local/thermo/badge_sensor_oknat.png
okok: /local/thermo/badge_sensor_okok.png
okdroog: /local/thermo/badge_sensor_okdroog.png
koudnat: /local/thermo/badge_sensor_koudnat.png
koudok: /local/thermo/badge_sensor_koudok.png
kouddroog: /local/thermo/badge_sensor_kouddroog.png
style:
top: 91%
left: 9%
width: 7.3%
- type: state-label
entity: sensor.badge_kelder
style:
top: 89.5%
left: 8.8%
font-size: 120%
text-shadow: 3px 3px 2px black
- type: image
image: /local/thermo/title_atelier.png
style:
top: 88.5%
left: 18.5%
- type: image
entity: sensor.badge_workshop_image
state_image:
hotnat: /local/thermo/badge_sensor_hotnat.png
hotok: /local/thermo/badge_sensor_hotok.png
hotdroog: /local/thermo/badge_sensor_hotdroog.png
oknat: /local/thermo/badge_sensor_oknat.png
okok: /local/thermo/badge_sensor_okok.png
okdroog: /local/thermo/badge_sensor_okdroog.png
koudnat: /local/thermo/badge_sensor_koudnat.png
koudok: /local/thermo/badge_sensor_koudok.png
kouddroog: /local/thermo/badge_sensor_kouddroog.png
style:
top: 91%
left: 23%
width: 7.3%
- type: state-label
entity: sensor.badge_workshop
style:
top: 89.5%
left: 22.8%
font-size: 120%
text-shadow: 3px 3px 2px black
- type: image
image: /local/thermo/title_was.png
style:
top: 89.8%
left: 30.5%
- type: image
entity: sensor.badge_laundry_image
state_image:
hotnat: /local/thermo/badge_sensor_hotnat.png
hotok: /local/thermo/badge_sensor_hotok.png
hotdroog: /local/thermo/badge_sensor_hotdroog.png
oknat: /local/thermo/badge_sensor_oknat.png
okok: /local/thermo/badge_sensor_okok.png
okdroog: /local/thermo/badge_sensor_okdroog.png
koudnat: /local/thermo/badge_sensor_koudnat.png
koudok: /local/thermo/badge_sensor_koudok.png
kouddroog: /local/thermo/badge_sensor_kouddroog.png
style:
top: 91%
left: 35%
width: 7.3%
- type: state-label
entity: sensor.badge_laundry
style:
top: 89.5%
left: 34.8%
font-size: 120%
text-shadow: 3px 3px 2px black
- type: image
image: /local/thermo/title_opslag.png
style:
top: 88.3%
left: 44%
- type: image
entity: sensor.badge_storage_image
state_image:
hotnat: /local/thermo/badge_sensor_hotnat.png
hotok: /local/thermo/badge_sensor_hotok.png
hotdroog: /local/thermo/badge_sensor_hotdroog.png
oknat: /local/thermo/badge_sensor_oknat.png
okok: /local/thermo/badge_sensor_okok.png
okdroog: /local/thermo/badge_sensor_okdroog.png
koudnat: /local/thermo/badge_sensor_koudnat.png
koudok: /local/thermo/badge_sensor_koudok.png
kouddroog: /local/thermo/badge_sensor_kouddroog.png
style:
top: 91%
left: 48.5%
width: 7.3%
- type: state-label
entity: sensor.badge_storage
style:
top: 89.5%
left: 48.3%
font-size: 120%
text-shadow: 3px 3px 2px black
- type: image
image: /local/thermo/title_badkamer.png
style:
top: 91%
left: 58%
- type: image
entity: sensor.badge_bathroom_image
state_image:
hotnat: /local/thermo/badge_sensor_hotnat.png
hotok: /local/thermo/badge_sensor_hotok.png
hotdroog: /local/thermo/badge_sensor_hotdroog.png
oknat: /local/thermo/badge_sensor_oknat.png
okok: /local/thermo/badge_sensor_okok.png
okdroog: /local/thermo/badge_sensor_okdroog.png
koudnat: /local/thermo/badge_sensor_koudnat.png
koudok: /local/thermo/badge_sensor_koudok.png
kouddroog: /local/thermo/badge_sensor_kouddroog.png
style:
top: 91%
left: 65%
width: 7.3%
- type: state-label
entity: sensor.badge_bathroom
style:
top: 89.5%
left: 64.9%
font-size: 120%
text-shadow: 3px 3px 2px black
- type: image
entity: sensor.therm_img_bathroom
image: /local/thermo/thermostat.png
state_image:
heating: /local/thermo/thermostatON.png
idle: /local/thermo/thermostatOFF.png
style:
top: 84.7%
left: 58.5%
- type: state-label
entity: sensor.therm_bathroom
tap_action:
action: none
style:
top: 84.5%
left: 58.4%
font-size: 170%
text-shadow: 3px 3px 2px black
- type: image
entity: climate.bathroom
image: /local/thermo/thermostatinvisible.png
tap_action:
action: more-info
style:
top: 84.5%
left: 58.4%
- type: image
image: /local/thermo/title_tuinkamer.png
style:
top: 91%
left: 77%
- type: image
entity: sensor.badge_garden_room_image
state_image:
hotnat: /local/thermo/badge_sensor_hotnat.png
hotok: /local/thermo/badge_sensor_hotok.png
hotdroog: /local/thermo/badge_sensor_hotdroog.png
oknat: /local/thermo/badge_sensor_oknat.png
okok: /local/thermo/badge_sensor_okok.png
okdroog: /local/thermo/badge_sensor_okdroog.png
koudnat: /local/thermo/badge_sensor_koudnat.png
koudok: /local/thermo/badge_sensor_koudok.png
kouddroog: /local/thermo/badge_sensor_kouddroog.png
style:
top: 91%
left: 84.5%
width: 7.3%
- type: state-label
entity: sensor.badge_garden_room
style:
top: 89.5%
left: 84.4%
font-size: 120%
text-shadow: 3px 3px 2px black
- type: image
entity: sensor.therm_img_garden_room
image: /local/thermo/thermostat.png
state_image:
heating: /local/thermo/thermostatON.png
idle: /local/thermo/thermostatOFF.png
style:
top: 84.7%
left: 77.5%
- type: state-label
entity: sensor.therm_garden_room
tap_action:
action: none
style:
top: 84.5%
left: 77.4%
font-size: 170%
text-shadow: 3px 3px 2px black
- type: image
entity: climate.garden_room
image: /local/thermo/thermostatinvisible.png
tap_action:
action: more-info
style:
top: 84.5%
left: 77.4%
- type: image
image: /local/cat.png
tap_action:
action: more-info
style:
top: 67.5%
left: 93.4%
width: 13%
- type: state-label
entity: sensor.catdoorround
style:
top: 67%
left: 91.4%
font-size: 170%
text-shadow: 3px 3px 2px black
tap_action:
action: call-service
service: browser_mod.popup
service_data:
title: Cat Door
large: true
card:
type: 'custom:mini-graph-card'
entities:
- input_number.cat_door
hours_to_show: 168
fixed_value: true
- type: conditional
conditions:
- entity: binary_sensor.catdoor
state: 'on'
elements:
- type: image
image: /local/cat.gif
tap_action:
action: toggle
style:
top: 39%
left: 26%
width: 180%
- type: conditional
conditions:
- entity: input_boolean.fritz
state: 'on'
elements:
- type: image
image: /local/fritzalarm.png
tap_action:
action: call-service
service: input_boolean.turn_off
service_data:
entity_id: input_boolean.fritz
style:
top: 48%
left: 50%
width: 80%
- type: state-label
entity: sensor.covid_today
style:
top: 97.5%
left: 96%
font-size: 150%
text-shadow: 3px 3px 2px black
background-color: rgb(71 4 58 / 40%)
tap_action:
action: call-service
service: browser_mod.popup
service_data:
title: Covid in NL
large: true
card:
type: 'custom:mini-graph-card'
entities:
- sensor.covid_today
- type: state-label
entity: sensor.memory_use_percent
style:
top: 97.5%
left: 4%
font-size: 120%
text-shadow: 3px 3px 2px black
background-color: rgb(71 4 58 / 40%)
tap_action:
action: call-service
service: browser_mod.popup
service_data:
title: Memory Used
large: true
card:
type: 'custom:mini-graph-card'
entities:
- sensor.memory_use_percent
show:
labels: true
extrema: true
lower_bound: 0
higher_bound: 100
color_thresholds:
- value: 60
color: '#2bc058'
- value: 79
color: '#d35400'
- value: 80
color: '#c0392b'
image: /local/000FloorPanOFF.png
style: |
ha-card {
background: none;
color: white;
}
no-header:
card-mod-theme: no-header
card-mod-root: |
app-header {
display: none;
}
Value Template to make the badges with colors based on temperature and humidity
- platform: template
sensors:
badge_office_image:
value_template: >
{% set roomsensortemp = 'sensor.office_temp' %} {% set roomsensorhumid = 'sensor.office_humidity' %}
{% if states(roomsensortemp) |float > 21 and states(roomsensorhumid) |float > 60 %}
hotnat
{% elif states(roomsensortemp) |float > 21 and states(roomsensorhumid) |float < 40 %}
hotdroog
{% elif states(roomsensortemp) |float > 21 and states(roomsensorhumid) |float > 40 < 60 %}
hotok
{% elif states(roomsensortemp) |float < 21 and states(roomsensorhumid) |float > 60 %}
koudnat
{% elif states(roomsensortemp) |float < 18 and states(roomsensorhumid) |float < 40 %}
kouddroog
{% elif states(roomsensortemp) |float < 18 and states(roomsensorhumid) |float > 40 < 60 %}
koudok
{% elif states(roomsensortemp) |float < 18 and states(roomsensorhumid) |float > 60 %}
koudnat
{% elif states(roomsensortemp) |float < 21 > 18 and states(roomsensorhumid) |float < 40 %}
okdroog
{% elif states(roomsensortemp) |float < 21 > 18 and states(roomsensorhumid) |float > 40 < 60 %}
okok
{% else %}
oknat
{% endif %}
Sensor to have both temp and humidity side by side as text
- platform: template
sensors:
badge_kitchen:
value_template: >
{% set roomsensortemp = 'sensor.kitchen_temp' %} {% set roomsensorhumid = 'sensor.kitchen_humidity' %}
{{ states(roomsensortemp) | round(0) }}{{'\xa0\xa0\xa0\xa0\xa0'}}{{ states(roomsensorhumid) | round(0) }}
Getting the time nicely displayed at the top (the sensor)
- platform: template
sensors:
simple_time_date:
friendly_name: "Simple Time Date"
value_template: "{{ now().timestamp() | timestamp_custom('%H:%M - %A, %d %B') }}"
Switch for the “warmer button”
warmeroffice:
turn_on:
- service: climate.set_temperature
data:
temperature: 19
entity_id: climate.office
turn_off:
- service: climate.set_temperature
data:
temperature: 16
entity_id: climate.office
And that’s all what I can think of for now! Happy to answer questions.