| name | home-assistant-card |
| description | Use when creating, reviewing, debugging, or maintaining Home Assistant custom Lovelace cards or card editors, including custom elements, Web Components, hass data, setConfig, getCardSize/getGridOptions, getConfigElement/getConfigForm, window.customCards, resource registration, HACS card packages, entity display, service calls, translations, or frontend build validation. |
Home Assistant Card Skill
Use this skill for Home Assistant custom card development. Custom cards are Web Components; any framework that defines custom elements can work. Lit and helper libraries are optional unless the repo already uses them.
This is separate from Python integrations, automations, scripts, helpers, and ordinary dashboard YAML. Use those skills unless the work changes a custom card package, registration, editor, or card usage contract.
Start With Current Docs
Fetch current markdown from the Home Assistant developers docs repository before changing card APIs. All doc paths in this skill's references are relative to this base URL — prepend it when fetching:
https://raw.githubusercontent.com/home-assistant/developers.home-assistant/master/docs/
Use rendered pages on developers.home-assistant.io only as secondary reading. Fetch only relevant files, and do not copy Home Assistant docs into generated skill or repo files.
Use references/frontend-docs.md as the docs routing index. The most important source is frontend/custom-ui/custom-card.md.
Local Workflow
- Inspect local instructions first:
AGENTS.md, package scripts, README, HACS metadata, build config, source entrypoints, card/editor files, translations, and release notes.
- Preserve the existing architecture and framework. Do not convert frameworks, add helper libraries, or add build tooling unless required.
- Read the relevant reference:
references/card-workflow.md for repo structure and validation, for card API patterns, for card/editor examples, and for current docs.