skills.rest
informatico-madrid
informatico-madridCOMMUNITY
Explore all skills by this author →
GitHub

homeassistant-dashboard-designer

Refactor Home Assistant Lovelace dashboards with template-driven YAML and MCP validation.

4|Updated Nov 18, 2025
Search Tags:#templates#dashboards#validation#design-system#home-assistant#lovelace
One-click install
npx skills add https://github.com/informatico-madrid/ha-ev-trip-planner --skill homeassistant-dashboard-designer-informatico-madrid
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: homeassistant-dashboard-designer
Source: https://github.com/informatico-madrid/ha-ev-trip-planner/tree/main/.agents/skills/homeassistant-dashboard-designer
Command: npx skills add https://github.com/informatico-madrid/ha-ev-trip-planner --skill homeassistant-dashboard-designer-informatico-madrid

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires PyYAML, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This skill enables safe, deterministic design, update, and refactor of Home Assistant Lovelace dashboards by enforcing a constrained design system, centralized templates, and validation against live HA data via MCP.

Core Features & Use Cases

  • Enforces a button-card-first design system and deterministic YAML outputs
  • Validates Lovelace structure and entities/services before applying changes (MCP integration)
  • Translates natural-language requests into compliant dashboard edits for config/dashboards/**

Quick Start

Describe your desired dashboard changes in natural language to generate a compliant Lovelace update plan.

Frequently Asked Questions about homeassistant-dashboard-designer

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I design Home Assistant Lovelace dashboards safely without breaking existing configurations?▼

Home Assistant Lovelace dashboards are designed safely by enforcing a constrained, template-driven design system with centralized styling and strict validation of entities and services before applying changes. This prevents configuration errors during refactors or new dashboard creation.

Does Lovelace dashboard validation check entities and services against live Home Assistant data?▼

Lovelace dashboard validation checks entities and services against live Home Assistant data via MCP integration when available. This ensures all referenced configurations are valid before applying changes, maintaining strict validation across the dashboard design system.

Can I use button-card templates for centralized styling in Home Assistant dashboards?▼

Button-card templates are supported as the primary design system for Home Assistant dashboards, enabling centralized styling and deterministic YAML outputs. This approach enforces consistent visual design across grid and vertical-stack layouts in Lovelace views.

What's the best way to refactor Home Assistant Lovelace dashboards using YAML?▼

The best way to refactor Home Assistant Lovelace dashboards is using a constrained, template-driven design system that enforces button-card-first templates and grid/vertical-stack layouts. This approach ensures deterministic YAML outputs with centralized styling and validation via MCP when available.

Do I need PyYAML to validate Lovelace dashboard configurations?▼

PyYAML is required as a dependency to parse and validate Lovelace dashboard YAML configurations. It enables the constrained design system to process deterministic YAML outputs and apply centralized styling templates correctly for Home Assistant dashboard tasks.

Related Skills

Explore More Design & Creative Skills→
ojiudezueojiudezue
1

ha-dashboard

Automate Home Assistant Lovelace dashboard configuration and customization.

Community
Advanced
CCOSTANCCOSTAN
5.3k

homeassistant-dashboard-designer

Design and refactor Home Assistant Lovelace dashboards into constrained button-card-first YAML.

Community
Advanced
carrotwaxrcarrotwaxr
37

visual-style

Enforce consistent visual styling for Peek UI components with CSS custom properties and Tailwind patterns.

Community
Intermediate
informatico-madridinformatico-madrid
4

homeassistant-config

Validate Home Assistant YAML configurations for syntax, structure, and best practices.

Community
Advanced