This is the code plus the instruction chatgpt provided me with when i asked for a smart home dashboard using home assistant
views:
# =====================
# 0) Home (Quick view)
# =====================
- title: Home
icon: mdi:home
type: sections
background:
color: var(--background-color)
sections:
- type: grid
cards:
- type: heading
heading: Quick Actions
heading_style: title
- type: grid
columns: 4
cards:
- type: button
name: All Lights Off
icon: mdi:lightbulb-off
tap_action:
action: call-service
service: light.turn_off
target: { area_id: [] } # turn off all lights
- type: button
name: Goodnight
icon: mdi:weather-night
tap_action:
action: call-service
service: scene.turn_on
target: { entity_id: scene.goodnight }
- type: button
name: Arriving
icon: mdi:car-door
tap_action:
action: call-service
service: script.turn_on
target: { entity_id: script.arriving_home }
- type: button
name: Away
icon: mdi:home-export-outline
tap_action:
action: call-service
service: script.turn_on
target: { entity_id: script.away_mode }
- type: grid
cards:
- type: heading
heading: Status
heading_style: subtitle
- type: grid
columns: 4
cards:
- type: tile
entity: alarm_control_panel.home_alarm
name: Alarm
- type: tile
entity: climate.downstairs
name: Climate
- type: tile
entity: sensor.home_temperature
name: Temp
color: primary
- type: tile
entity: binary_sensor.front_door
name: Front Door
- type: grid
cards:
- type: heading
heading: Rooms
heading_style: subtitle
- type: grid
columns: 3
cards:
- type: area
area: living_room
navigation_path: /lovelace/rooms
- type: area
area: kitchen
navigation_path: /lovelace/rooms
- type: area
area: bedroom
navigation_path: /lovelace/rooms
# =====================
# 1) Rooms (by area)
# =====================
- title: Rooms
icon: mdi:floor-plan
type: sections
sections:
- type: area
area: living_room
- type: area
area: kitchen
- type: area
area: bedroom
- type: area
area: office
# =====================
# 2) Lighting
# =====================
- title: Lighting
icon: mdi:lightbulb-group
type: sections
sections:
- type: grid
cards:
- type: heading
heading: All Lights
heading_style: title
- type: entities
show_header_toggle: true
entities:
- entity: light.living_room
name: Living Room
- entity: light.kitchen
- entity: light.bedroom
- entity: light.hallway
- type: grid
cards:
- type: heading
heading: Dimmers & Scenes
heading_style: subtitle
- type: grid
columns: 3
cards:
- type: tile
entity: light.living_room_lamp
features:
- type: light-brightness
- type: tile
entity: light.kitchen_spots
features:
- type: light-brightness
- type: tile
entity: scene.movie
# =====================
# 3) Climate
# =====================
- title: Climate
icon: mdi:thermostat
type: sections
sections:
- type: grid
cards:
- type: heading
heading: AC & Heating
heading_style: title
- type: grid
columns: 2
cards:
- type: thermostat
entity: climate.downstairs
name: Downstairs AC
- type: thermostat
entity: climate.upstairs
name: Upstairs AC
- type: grid
cards:
- type: heading
heading: Air Quality
heading_style: subtitle
- type: grid
columns: 3
cards:
- type: gauge
entity: sensor.living_room_humidity
name: Humidity
min: 0
max: 100
- type: gauge
entity: sensor.pm25
name: PM2.5
min: 0
max: 200
- type: tile
entity: fan.air_purifier
name: Purifier
# =====================
# 4) Security
# =====================
- title: Security
icon: mdi:shield-home
type: sections
sections:
- type: grid
cards:
- type: heading
heading: Doors & Windows
heading_style: title
- type: entities
entities:
- binary_sensor.front_door
- binary_sensor.back_door
- binary_sensor.kitchen_window
- type: grid
cards:
- type: heading
heading: Locks & Alarm
heading_style: subtitle
- type: grid
columns: 3
cards:
- type: tile
entity: lock.front_door
name: Front Lock
- type: tile
entity: alarm_control_panel.home_alarm
name: Alarm
- type: tile
entity: siren.siren
name: Siren
- type: grid
cards:
- type: heading
heading: Cameras
heading_style: subtitle
- type: grid
columns: 2
cards:
- type: picture-entity
entity: camera.front_porch
camera_view: live
show_state: false
- type: picture-entity
entity: camera.driveway
camera_view: live
show_state: false
# =====================
# 5) Media
# =====================
- title: Media
icon: mdi:television-speaker
type: sections
sections:
- type: grid
cards:
- type: heading
heading: Players
heading_style: title
- type: grid
columns: 3
cards:
- type: media-control
entity: media_player.living_room_tv
- type: media-control
entity: media_player.kitchen_speaker
- type: media-control
entity: media_player.bedroom_speaker
- type: grid
cards:
- type: heading
heading: Announce / Intercom
heading_style: subtitle
- type: grid
columns: 3
cards:
- type: button
name: Dinner Time
icon: mdi:bullhorn
tap_action:
action: call-service
service: notify.alexa_media
data:
target: ["media_player.kitchen_speaker"]
message: "Dinner is ready. Please come to the kitchen."
data:
type: announce
- type: button
name: All Rooms
icon: mdi:bullhorn-outline
tap_action:
action: call-service
service: notify.alexa_media
data:
target:
- media_player.living_room_tv
- media_player.kitchen_speaker
- media_player.bedroom_speaker
message: "Announcement from Homee."
data:
type: announce
- type: button
name: Stop Audio
icon: mdi:stop-circle
tap_action:
action: call-service
service: media_player.media_stop
target:
entity_id:
- media_player.living_room_tv
- media_player.kitchen_speaker
- media_player.bedroom_speaker
# =====================
# 6) Energy
# =====================
- title: Energy
icon: mdi:leaf
type: sections
sections:
- type: grid
cards:
- type: heading
heading: Energy Overview
heading_style: title
- type: energy-distribution
- type: energy-solar-graph
- type: energy-usage-graph
# =====================
# 7) Automations & Scenes
# =====================
- title: Automations
icon: mdi:robot
type: sections
sections:
- type: grid
cards:
- type: heading
heading: Scenes
heading_style: title
- type: grid
columns: 4
cards:
- type: tile
entity: scene.morning
- type: tile
entity: scene.movie
- type: tile
entity: scene.goodnight
- type: tile
entity: scene.away
- type: grid
cards:
- type: heading
heading: Routines
heading_style: subtitle
- type: entities
entities:
- script.arriving_home
- script.away_mode
- automation.lock_doors_at_night
- automation.turn_on_porch_at_sunset
# =====================
# 8) Cameras (full screen)
# =====================
- title: Cameras
icon: mdi:cctv
type: sections
sections:
- type: grid
cards:
- type: picture-glance
entities:
- light.porch
- switch.driveway_spot
title: Front Porch
camera_image: camera.front_porch
camera_view: live
- type: picture-glance
entities:
- switch.driveway_spot
title: Driveway
camera_image: camera.driveway
camera_view: live
This is the code plus the instruction chatgpt provided me with when i asked for a smart home dashboard using home assistant
How to install (quick)
In
configuration.yaml, add:
lovelace:
mode: yaml
dashboards:
homee:
mode: yaml
title: Homee
icon: mdi:home-automation
show_in_sidebar: true
filename: dashboards/homee.yaml
Save the canvas content as
config/dashboards/homee.yaml.Replace the placeholder entities (e.g.,
light.living_room,climate.downstairs,camera.front_porch) with yours.(Optional) Copy the theme at the bottom of the canvas into
config/themes/homee.yaml, then:
frontend:
themes: !include_dir_merge_named themes