Padraiggg

Padraiggg / Padraigggs-ha-interactive-floorplan

Public

HA Interactive Floorplan Card - Vue 3 web component for Home Assistant

padraiggg.github.ioPadraigggs-ha-interactive-floorplandemo
10
0
100% credibility
Found Mar 21, 2026 at 10 stars -- GitGems finds repos before they trend. Get early access to the next one.
Sign Up Free
AI Analysis
JavaScript
AI Summary

Custom Home Assistant cards that display an interactive floorplan image with clickable smart home devices and a built-in visual editor for easy setup.

How It Works

1
🏠 Discover the floorplan tool

You find a fun way to see and control your smart home lights, switches, and cameras right on a picture of your house.

2
📦 Add it to your smart home hub

With one click in your Home Assistant store, you bring the viewer and editor cards into your dashboard.

3
🖼️ Upload your home photo

Drop a picture of your floorplan into the editor, and it becomes your interactive map.

4
🎨 Place and shape your devices

Drag lights, cameras, and switches onto the photo, draw glowing areas around them, and pick pretty colors – it feels like decorating!

5
💾 Save your creation

Hit the button to instantly update your dashboard, no hassle.

6
👆 Tap to control everything

Switch to the view tab and click any device on the map to turn it on or off.

✨ Your home lights up magically

Lights glow their real colors, cameras blink when recording, and your whole house feels alive at your fingertips!

Sign up to see the full architecture

5 more

Sign Up Free

Star Growth

See how this repo grew from 10 to 10 stars Sign Up Free
Repurpose This Repo

Repurpose is a Pro feature

Generate ready-to-use prompts for X threads, LinkedIn posts, blog posts, YouTube scripts, and more -- with full repo context baked in.

Unlock Repurpose
AI-Generated Review

What is Padraigggs-ha-interactive-floorplan?

This JavaScript project builds two Vue 3 web components as Lovelace cards for Home Assistant: a viewer card rendering your home's interactive floor plan map with clickable lights, switches, cameras, and media players, plus an editor card for drag-and-drop setup. Upload a floorplan image, position entities visually, draw polygon light zones, and push configs directly to your dashboard—no YAML tweaks or external servers needed. Lights glow with real RGB colors and brightness from HA states, cameras blink on recording, solving clunky entity lists with a spatial, glanceable control panel.

Why is it gaining traction?

It skips YAML hell with a native editor card that loads and saves via WebSocket, offering live previews, overlay images for furniture, edge blur for realistic gradients, and smart domain detection to avoid service mismatches. Responsive scaling via container queries keeps labels crisp on any dashboard size, while long-press opens HA's more-info dialogs. The standalone demo lets you test an interactive floorplan Home Assistant setup instantly, hooking devs tired of static dashboards.

Who should use this?

Home Assistant users mapping smart homes spatially—like dashboard builders placing lights on actual floorplans for family kiosks or wall tablets. Ideal for enthusiasts with 20+ entities wanting one-click toggles over mushroom cards, or those upgrading from basic ha-floorplan to polygon zones and RGB visuals.

Verdict

Promising interactive floorplan card for HA at 10 stars and 1.0% credibility—early maturity shows in thin adoption but strong README, HACS support, and live demo make it low-risk to trial. Grab via HACS if visual home control fits; watch for broader entity types.

(198 words)

Sign up to read the full AI review Sign Up Free

Similar repos coming soon.