Easy Floorplan
[![hacs][hacs-badge]][hacs-url] [![release][release-badge]][release-url] [![license][license-badge]](LICENSE)
A Home Assistant Lovelace card for building an interactive floorplan with a visual drag-and-drop editor. Draw walls, place furniture and connect your devices to see and control your home in 2D or 3D.
Installation · Your first plan · Documentation
https://github.com/user-attachments/assets/c743c15d-07de-4f5f-9727-3b24b101c7c6
20-second overview: draw walls and doors, connect a Home Assistant entity, control lights, and view the plan in 3D.
Features
- Trace a plan — load a PDF or image in the editor, calibrate its scale and trace walls over it. See Tracing over an existing plan.
- Visual editing — draw walls, snap doors and windows into place, and arrange
- Live devices — control lights and switches, show sensor readings, and follow
labelPosition: auto).
- Lighting — colored light from your lamps and spots, day/night dimming, sunlight,
- Rooms and presence — zoom into rooms, link Home Assistant areas, show
- Multiple floors — switch between floors or navigate with a staircase.
- Floor summaries — aggregated floor badges (temp, humidity, presence, lights, windows) directly in the switcher.
- Furniture actions — give a piece a tap, hold or double-tap action. A round
showIcon: false to make the drawing itself the
button. See actions on furniture.
- 2D and 3D views — display the same plan flat or with raised walls and furniture.
- Window sill height — draw floor-to-ceiling or high windows in 3D with
sill. See Configuration. - Outdoor courtyard & 3D stacked house — exterior view of the entire house stacking all levels at physical elevations, with ground slabs and 3D roofs.
- Appearance — choose skins and named colors, add a background image to trace
Installation
HACS (recommended)
Distributed as a custom repository. Add it in one click:
Or add it manually:
- In Home Assistant, open HACS.
- Open ⋮ → Custom repositories.
- Add
https://github.com/nicosandller/easy-floorplanwith category
- Find Easy Floorplan and click Download.
- Hard-refresh your browser (Cmd/Ctrl-Shift-R).
Manual
- Download
easy-floorplan-card.jsfrom the [latest release][release-url]. - Copy it to
/www/easy-floorplan-card.js - Add a dashboard resource under Settings → Dashboards → ⋮ → Resources → Add:
/local/easy-floorplan-card.js
- Type: JavaScript module
- Hard-refresh your browser.
Create your first plan
- Edit your Home Assistant dashboard, select Add card and choose Easy Floorplan.
- In the visual editor, choose Wall and drag to draw each wall.
- Choose Door or Window and place it on a wall.
- Choose + Add → Device, move it into place, then select its Home Assistant
- Save the card and leave dashboard edit mode to try the controls.
type: custom:easy-floorplan-card
overlayScale: planUse the element guide for device settings, rooms, trackers and animations. The editor guide explains saving without closing the editor and locking finished elements in place.
Documentation
| Guide | What it covers |
| --- | --- |
| Editor | Applying changes and locking elements in place. |
| Editor workspace | Drawing tools, settings tabs, zoom and phone layouts, with screenshots. |
| Elements and controls | Devices, openings, rooms, trackers and animations, with examples. |
| Configuration | YAML keys, defaults, coordinates and a complete example. |
| Lighting | Device light, sun, moon, skylights, ambient daylight and clouds. |
| Appearance | Skins, colors, line art, SVG export, 3D view, room navigation, scaling and styling. |
| Behaviour | Actions, visibility, floor navigation and unavailable entities. Behavior → Show code editor sets YAML-only actions, such as popup-card's fire-dom-event, on one element without the whole-card YAML. |
| Roofs | Roof styles (gable, hip, shed, flat), configuration, overhang, and editing |
| Outdoor 3D Stacking | Multi-floor exterior elevation, ground slabs, and roof rendering. |
| Floor summaries | Aggregated switcher badges (climate, presence, lights, openings) with sensor discovery. |
| Furniture symbols | Creating and contributing your own symbols. |
| Video walkthrough | A community setup guide in Italian. |
See the [release notes][release-url] for published changes and the changelog for documented unreleased changes.
Development
Build commands and test guidance are in Contributing. The local Home Assistant guide explains the Docker demo, its sample plan and the development workflow.
Support
Use Issues to report bugs or request features, and Discussions to ask questions and share your setup.
License
[hacs-badge]: https://img.shields.io/badge/HACS-Custom-41BDF5.svg [hacs-url]: https://github.com/hacs/integration [release-badge]: https://img.shields.io/github/v/release/nicosandller/easy-floorplan [release-url]: https://github.com/nicosandller/easy-floorplan/releases [license-badge]: https://img.shields.io/github/license/nicosandller/easy-floorplan