Homekit Infused (HKI) Framework v2022.01.1

If you find any information on this page useful, feel free to buy me a coffee:

Buy Me A Coffee

GitHub last commit
HA Version
HKI Version

GitHub stars
GitHub forks
GitHub watchers
GitHub followers

Homekit Infused (A Complete Lovelace Dashboard)


This is Homekit Infused aka HKI. When you come here for the first time you might be a little confused to what this is.
Homekit Infused is in a nutshell a customizable ‘framework’ that you can use to build your own dashboard on, it is preconfigured to have an Apple style to it.
By default it contains the following things:

  • A beautiful header with notifications that is customizable per view and is added to each view for you automatically
  • A customizable navigation bar which can also be set at the bottom of the screen
  • 11 color schemes
  • A LOT of (optional) addons that can be turned on/off at will without any coding knowledge to enhance your lovelace experience
  • Easy updates, copy/replace 2 folders on each update!
  • And MUCH MUCH I mean MUCH more!

Quick Links

Click here for the documentation

Click here to download the latest release

Click here for addons

Click here for legacy (v3.x.x) addons

Click here to view how my personal Home Assistant is setup for v2021.x.x

Support Links

Click here for my YouTube channel

Click here to join our Discord Community with over 2000+ members


You can use this thread on the Home Assistant community to ask any questions you have.
Or join me on Discord together with @dwains. You should check out his theme as well: Click Here for Dwains Dashboard.

Thank you for taking the time to read all this and I hope you enjoy this release just as much as my wife and I do. Enjoy!

Greetings Jimz011


Good stuff! Time to dig through this for some inspiration.

I started trying to figure out how you did that “cool popup menu” at the very start of your video, and then I realized it was just the iOS accessibility tools. :laughing:

Yes, I used it because I wanted to show you where I was pressing. Would be confusing otherwise with those popup cards.

1 Like

I do have a somewhat similar card I made: https://github.com/custom-cards/radial-menu


Excellent work @jimz011!

That’s actually what I thought it might be at first. :laughing:

1 Like

Might find a place for that in the future. Thnx @iantrich

1 Like

Hello and congratulations for the excellent work !! I really like what you’ve done! could you also share your configuration.yaml files and others? I would like to do something similar but I’m not very experienced and I’m trying to understand from your lovelace.yam file. thanks anyway and again congratulations !!

All the config files are on the github repo (including the configuration.yaml file). If you have any specific question do not hesitate to ask.

1 Like

thank you very much I will be inspired by your board!

I will try to keep the repo up to date with new changes. But at the moment I am a bit tired of HA :stuck_out_tongue: have been working 8 months straight on Home Assistant so I need a short break. Currently I am cleaning code and preparing the code to have light and dark themes and to have it change depending on the state of the sun. I will update the title of the thread whenever I push a new update.

1 Like

well i think it’s normal. it takes a bit of rest! thanks and congratulations again

1 Like

Great setup!
Could you please tell me about the use of the Input Booleans (and provide configuration if possible). I am trying to recreate the remote UI for my Fire Stick, but at the moment, nothing happens when I try and open the remote popup.

Popup cards only work if all the popup cards on that view are setup correctly. If 1 single card is configured wrong or of 1 of the entities do not exist the card will not work.

The best way to use popup cards is to first make sure that all the cards actually popup (so keep them empty at first) I would even consider adding the popup cards one by one. Read up on the docs of that specific card. Also I have to mention that you should not use popup cards if the card has lights/devices that are regularly unavailable. If one entity in the card is not found it will just show the standard more-info window.

The config of my popup cards can be found above the home view. Just try to remove all popup cards and just add a single one to try. The other cards will then just be a standard more-info window (like you have now, but that is most likely of some missing entity somewhere).


One question. On my iphone, in home assistant companion app the button-card background colour is not shown.
This is the part.

- --paper-card-background-color: var(--homekit-white)

On pc, from chrome, all is ok ! I am sure I have some problem with polymer !
Any suggestion to solve this issue, please? :slight_smile:

Thanks a lot in advance,


You need to have that set up in themes.yaml, or change the var into rgb(37,37,37) change the 37 into the color you want.

Also you will need to be sure you have that theme selected on your iphone as well.


Thanks for the fast reply! :slight_smile:
I solved the issue with emptying the cache on ios !
Congrat to your nice system anyway!



1 Like

Hi Jimzz011

First of all, great stuff! I am learning a lot from your config.

I have a question regard your scene activation. Just wondering how you are able to have the scene button show on and off state with input_boolean.

So for example your dagverlichting scene, when pressed activates your scene.dagverlichting, then pressing it again will it turn off the lights in the scene? Or do you have to press another scene to deactivate an activated scene…

I am seeing your automation:

- alias: scene dagverlichting on
  initial_state: 'true'
    - platform: state
      entity_id: group.scene_dagverlichting_on
      to: 'on'
    - platform: state
      entity_id: group.scene_dagverlichting_off
      to: 'off'
    condition: and
      - condition: state
        entity_id: group.scene_dagverlichting_off
        state: 'off'
      - condition: state
        entity_id: group.scene_dagverlichting_on
        state: 'on'
    - service: input_boolean.turn_on
        entity_id: input_boolean.scene_dagverlichting
- alias: scene dagverlichting off
  initial_state: 'true'
  - platform: state
    entity_id: group.scene_dagverlichting_on
    to: 'off'
  - platform: state
    entity_id: group.scene_dagverlichting_off
    to: 'on'
  - service: input_boolean.turn_off
      entity_id: input_boolean.scene_dagverlichting

Not sure I understand how this works… what is contained in the groups ie. group.scene_dagverlichting_on / off? Could you please elaborate?
Thanks a bunch!

The scenes are just the same as the standard home assistant scenes. So they are “one-way” only. I wanted them to be more like Apple Homekit does, where the scenes are lit when activated but only if all devices in the scene matches its state. E.g. I have a scene with 3 switches, I have set it up so that when I activate the scene all 3 switches turn on. The scene will light up showing it is activated. Now imagine you turn a device off. The scene would no longer be active as the states do not match to what you have set up in the scene. So I want the scene to be unlit (turn off). But I also wanted it to light up if I would manually turn all these devices on, as normally it would only turn on if you would actuate the scene.

It is a bit hard to explain, but basically I use multiple scenes, an ‘on’ and ‘off’ scene. The input_booleans are made as dummy switches, as scenes can not be switched on or off, but they call a service, so a button wouldn’t change it’s state. The automations are made for the scenes to show the state on or off. It will always turn on if I activate a scene, and it will always turn off (or show as off, as the states no longer match the scene) when one of the devices changes its state. But I wanted the scene to be lit as well when I manually change the switches to ‘on’. The automation doesn’t do this, that is where the groups come in. The first group is the ‘on’ group which are all the devices that have to be ‘on’ for the scene to be turned to ‘on’, in my example those 3 switches have to be ‘on’. I have set it up so that the group will only be shown as ‘on’ when all 3 switches are ‘on’.

The automations are based on those groups being on or off and they correspond with the scenes I have set up in scenes.yaml, I have only done state and not the exact brightness of entities etc. because that would take a lot more work.

Anyways this is roughly how I try to make the scenes turn on/off. Have you seen the video I posted (the top post)? It shows what it does roughly. Also I am working on making this a whole lot simpler, easier to setup with less failure (as this will never work good after a restart and you will have to press all the scenes once to get it to work again). I will keep you informed if I have an update for this. For the time being I suggest you’d experiment a bit, if you have any more questions don’t hesitate to ask.

1 Like

@chenchen119 I made a video to show you exactly what I mean:

Click on the image to start the video:

Please don’t mind the crappy English, it is not my native language and it was late, was tired and couldn’t talk too loud because of a sleeping wife (she already hates it that I spend so much nights working on HA, so can’t get her mad about noise too eh :stuck_out_tongue:) At least she loves the results xD.