cards / house-card

House card

A visual floorplan card for Home Assistant. Draw rooms on a configurable grid, bind entity states to each room, and view your home as either a flat overhead plan or a 3D axonometric dollhouse — complete with per-room light glow, occupancy indicators, temperature data, and a thermal heatmap overlay.

v0.2.3 · HACS compatible · HA 2024.1+ · MIT
View on GitHub Install →
House card · axonometric view

Features

  • 3D axonometric dollhouse view. Rooms rendered as 3D boxes with illuminated top face and side wall panels. Unlit rooms are dark; lit rooms glow with the light's actual RGB colour.
  • Flat overhead grid view. Clean CSS 3D-tilted floor plan with per-room info cards and light spill glow — switchable at runtime.
  • Multi-floor support. Floors stack vertically in the dollhouse view with configurable gap. Tab switching in flat mode.
  • Heatmap thermal overlay. Colour-ramp temperature overlay and humidity droplets per room. Toggle between off, temperature, humidity, and combined modes.
  • Sun-based ambient theming. Subtle amber tint at golden hour, blue-amber at dusk, deep blue at night — driven by sun.sun elevation.
  • TV & wallboard optimised. All font and icon sizes use vw-based clamp() so text is legible from across the room without manual tuning.

Install

One-click install via the Home Assistant Community Store. Updates land automatically.

01
Open HACS → Frontend → Custom repositories. Add this URL as type Lovelace: 
https://github.com/squizzer73/lovelace-house-card
02
Install house-card, then add the resource to your Lovelace config (HACS handles this on most setups).
03
Or hit the badge:
HACS Open in My Home Assistant

Configuration

Option Type Default Description
type string required Always custom:house-card.
floors list required Array of floor objects. Each floor has name, rooms, and optional grid_cols / grid_rows.
view string axo Render mode: axo (3D dollhouse) or flat (overhead grid with CSS tilt).
wall_height number 25 Height of axonometric wall panels in pixels. Lower values give a flatter silhouette.
floor_gap number 250 Vertical gap between stacked floors in the axonometric view.
sun_entity string sun.sun Entity used for time-of-day ambient theming. Elevation drives warm amber → deep blue shift.
heatmap string off Thermal overlay mode: off · temperature · humidity · combined.
rooms[].name string required Display name for the room.
rooms[].light string light.* entity. Room glows with the light's actual RGB colour when on.
rooms[].motion string Binary sensor for occupancy. Animated person icon appears on trigger; fades out after 7 s.
rooms[].temp string Temperature sensor. Shown on the in-room info card.
rooms[].humid string Humidity sensor. Shown on the in-room info card.
rooms[].type string room Room type for the MDI watermark icon. One of 19 types: bedroom · lounge · kitchen · bathroom · office · garage and more.

Changelog

v0.2.3 10 May 2026
  • Axonometric dollhouse view with illuminated wall panels and recessed info cards.
  • Sun-based ambient theming — amber at golden hour, deep blue at night.
  • TV/wallboard optimised: vw-based clamp() font sizing for legibility across the room.
  • Occupancy pulse animation on person icon appearance.
  • Multi-floor vertical stacking with configurable floor gap.
  • Double-ring floor glow with light's actual RGB colour.
v0.2.2 8 May 2026
  • Axonometric view Phase 1: perspective SVG projection and wall panels.
  • HTTPS SVG filter fix — inline filter:blur() avoids HA base-tag issue.
v0.2.0 May 2026
  • Heatmap thermal overlay: temperature colour ramp and humidity droplets per room.
  • Heatmap mode toggle in card header (off / temperature / humidity / combined).
v0.1.9 May 2026
  • Light spill glow driven by rgb_color attribute with 400 ms transition.
  • Tap to toggle light, long-press for more-info dialog.
  • Room type icons — 19 types with MDI watermark.
  • Occupancy watermark with asymmetric fade (0.5 s in, 7 s out).