Skip to content

Installation

  1. Open HACS in Home Assistant
  2. Click on "Integrations"
  3. Click the three dots menu → "Custom repositories"
  4. Add repository URL: https://github.com/jimz011/hki-elements
  5. Select category: "Dashboard"
  6. Click "Add"
  7. Find "HKI Elements" and install it
  8. Refresh your browser

Manual Installation

  1. Download hki-elements.js from the latest release
  2. Copy it to your www folder in your Home Assistant config directory
  3. Add the following to your Lovelace resources (Settings → Dashboards → Resources): 
    url: /local/hki-elements.js
type: module
  4. Restart Home Assistant

Usage

After installation, all five cards will be available in your Lovelace card picker:

  • type: hki-header-card
  • type: hki-button-card
  • type: hki-navigation-card
  • type: hki-notification-card
  • type: hki-postnl-card

Migration from Individual Cards

If you previously installed individual HKI cards, here's how to migrate:

  1. Before installing HKI Elements:
  2. Note which individual cards you have installed

  3. Your dashboard configurations will continue to work

  4. Install HKI Elements via HACS or manually

  5. Remove old individual cards:

  6. Go to HACS → Frontend
  7. Remove the individual HKI card repositories (e.g., "HKI Header Card", "HKI Button Card", etc.)

  8. Remove the old resource entries from Settings → Dashboards → Resources

  9. That's it! Your dashboards will continue working because the card types remain the same

Option 2: Side-by-Side (Temporary)

You can run HKI Elements alongside individual cards temporarily: - Both will work without conflicts - Remove individual cards when ready - No dashboard changes needed