Source: https://cards.flixlix.com/energy-breakdown-card/installation

Energy Breakdown Card

# Installation

Install it from its link in Home Assistant's Marketplace, or as a custom repository in HACS before 2026.11. Manual installation is also supported.

Not in the default catalog yet

**Energy Breakdown Card** is installed from its link: the button below opens it in your Home Assistant, in the Marketplace on 2026.11 and newer or in HACS before that.

[Open in Home Assistant](https://my.home-assistant.io/redirect/hacs_repository/?owner=flixlix&repository=energy-breakdown-card&category=plugin)

## Marketplace (Home Assistant 2026.11 and newer)

1.  Go to **Settings → Marketplace**.
2.  In the upper-right corner, select **Add from link**, enter `https://github.com/flixlix/energy-breakdown-card` and select **Add**. The Marketplace asks you to connect GitHub first if you haven't yet.
3.  Open **Energy Breakdown Card** in the list and select **Install**. The Marketplace adds it as a dashboard resource.
4.  Reload your browser.

## HACS (Home Assistant 2026.10 and older)

1.  In Home Assistant, open **HACS**.
2.  Click the **⋮** menu in the top-right and choose **Custom repositories**.
3.  Add the repository URL `https://github.com/flixlix/energy-breakdown-card` with category **Dashboard**, then click **Add**.
4.  Search for **Energy Breakdown Card** in HACS and click **Download**.
5.  Reload your dashboard / clear browser cache.

## Manual installation

Download `energy-breakdown-card.js` from the [latest release](https://github.com/flixlix/energy-breakdown-card/releases/latest) and copy it into `config/www/`.

If you configure dashboards via YAML, register the resource:

```yaml
lovelace:
  resources:
    - url: /local/energy-breakdown-card.js
      type: module
```

If you prefer the graphical editor: enable advanced mode in your user profile, go to **Settings → Dashboards → ⋮ → Resources**, click _Add resource_ and paste:

```text
/local/energy-breakdown-card.js
```

Installed from the Marketplace or HACS?

It registers the resource for you. The Marketplace serves it from`/local/community/energy-breakdown-card/energy-breakdown-card.js`; HACS used`/hacsfiles/energy-breakdown-card/energy-breakdown-card.js`, which keeps working.

## Verify the install

1.  Reload your browser cache (hard refresh).
2.  Edit a dashboard and click **Add card → Custom: Energy Breakdown Card**.
3.  Use the UI editor or paste the minimal config below.

```yaml
type: custom:energy-breakdown-card
chart_type: bar
entities:
  - entity: sensor.solar_energy_today
  - entity: sensor.grid_energy_today
  - entity: sensor.battery_energy_today
```