HKI Elements

jimz011 · February 16, 2026, 4:14am

A collection of custom Home Assistant cards and integrations for creating beautiful, functional dashboards.

What is HKI Elements?

HKI Elements is an ecosystem of interconnected custom cards and integrations for Home Assistant, designed to work seamlessly together.

These cards have tons of customization options and can all be configured directly from the UI without the need of knowing any YAML.

All cards support Jinja2 templates, real-time updates, and can inherit styling from each other for a cohesive dashboard experience.

I hope that someone can make use of this and/or improve ones Home Assistant setup. Installation is super easy and configuring this is pretty straight forward. These cards are designed to work specifically with the new sections layout in Home Assistant.

You can find the documentation here

Components

HKI Header Card

Beautiful dashboard headers with backgrounds, weather displays, date/time, and person tracking. Perfect for setting the tone of your views.

Screenshots

HKI Navigation Card

Floating navigation buttons with horizontal and vertical layouts, conditional visibility, and extensive styling options.

Screenshots

HKI Notification System

HKI Notify Integration - Creates notification sensors and provides services to send, update, and dismiss notifications with rich styling and actions.

HKI Notification Card - Displays notifications in multiple modes: ticker (auto-cycling), marquee (scrolling), list (stacked), or button (popup).

Screenshots

HKI PostNL Card

Package tracking for PostNL deliveries with animated visualizations and detailed shipment information.

Screenshots

HKI Button Card

Advanced entity control card with multiple layouts (square, badge, tile, Google) and rich custom popups for lights, climate, dehumidifiers, fans, switches and locks (with more custom made popups coming in the future).

Screenshots

HKI Settings Card

A Master Card to style all the other cards at once (e.g. you want to change all the buttons border-radius to 25px), this card allows you to do that. This card is created to be used with HA’s visual editor.

Screenshots Full Display

IOT7712 · February 16, 2026, 6:19am

I note there have been howls of protest at recent dashboard changes.
Does your suite support the latest changes, and will it be flexible and able to cope with future changes?

jimz011 · February 16, 2026, 1:07pm

Could you tell me which protests exactly? I didnt really have much time to follow the community the past few months. So I developed this as is.

laurens362 · February 17, 2026, 9:51am

Really great cards! Love them!!

jimz011 · February 18, 2026, 1:26am

Release 1.0.1

HKI Button Card

States should now show the correct name for your locale (e.g. Aus/Ein or Uit/Aan instead of On/Off)
Added a new popup type, custom popup. This popup allows you to get the same HKI popup styling but fill it with your own cards. You can find out more about this feature in the documentation. This setting is of course also available in the visual editor under the HKI Popup Settings.

HKI Header Card

Removed unnecessary console message logging

The other cards remain unchanged.

Release 1.0.2

HKI Button Card

Fixed bug where actions would not work on custom popups
Known issues: the default HA button card doesn’t seem to work in the custom popup. All other tested cards worked fine. custom:button-card works fine as well. But I suspect not many people actually use the default HA button card anyways.

The other cards remain unchanged.

The custom popups allow you to make remote controls like this:

reyrios · February 18, 2026, 5:44pm

Great cards! I cannot seem to resize the Button Card via Layout. Is there any way to do this?

jimz011 · February 18, 2026, 6:15pm

At this moment only the layout decides the size (only the tile style has adjustable height).

This card was mainly created for use inside a grid (which allows for some control of the size). The card started with a lot more customization regarding the size but since it was always a bit buggy I chose to remove it in favor of the presets.

Note that the button-card is still a pretty early version and I will try to make it better in the future. But for now this is (unfortunately) how it works.

jimz011 · February 19, 2026, 1:22am

Release 1.0.3

HKI Button Card

Fixed bug when using custom popups we’d get an empty text field when opening the visual editor
Fixed bug where we could not use templates within cards like markdown in a custom popup
HKI Popups would only open on supported domains, it can now be opened on any domain (even if no entity is selected)
Fixed bug where custom icons were not shown in the popups (e.g. light or cover popup), but a hardcoded one instead. It will now show correctly.
Added animation options for popups, you can set a different animation for opening and closing the popups and a duration for it.

HKI Navigation Card

Removed unnecessary console logging.

The other cards remain unchanged.

jimz011 · February 22, 2026, 2:10am

Release 1.1.0

*This is a very huge update, it shouldn’t have any breaking changes except for the info_display visibility setting. It is possible that there are some breaking changes that I simply missed. If you find anything no longer working for you please open an issue on GitHub.

HKI Button Card

Fixed bug where setting a custom name, state or icon color would only work on the actual buttons but not be reflected in the HKI Popups
Added compatibility modes for HKI Header Card
All HKI Popups now have the ‘scale’ animation on by default
HKI Custom Popups now show a card-picker instead of the previous text input. You no longer need to understand yaml to build a custom popup.
Fixed a bug where the light color would not be reflected in the HKI Popup (if no custom color was defined)
Fixed a bug where in some cases a HKI Popup would re-render on state change
Fixed a bug where hki badges inside a horizontal stack would not align correctly when using different badge sizes inside the stack.
Fixed an issue where we couldn’t hide the info_display/brightness on a button

HKI Header Card

Added custom card type to header slots, you can now use any card. WARNING! This may or may not function properly with each card.
Added alignment settings to header slots (start, center, end and stretch). Stretch is useful for custom cards (e.g. like a sensor or graph card)
Added 3 new optional bottom slots (this can be used to replace the badges slots for more control over badge placements)
Added compatibility with HKI Button Card (you can now use this card inside the header if desired)
Added option for custom HKI Popups in the header card (just like in the HKI Button Card), this allows you to make nicer weather or person views (or whatever else you want), the same settings and same logic applies to this popup as the one in the HKI Button Card

Schermafbeelding 2026-02-22 0123091168×460 11.6 KB

HKI PostNL Card

Fixed a bug where the dropdown for receiving packages would not open unless we opened another tab first

HKI Notification Card

Added animation options for the notification popup
Popups now use the same default animations as the popups in HKI Header Card and HKI Button Card

HKI Navigation Card

No changes

Other Changes

Various bugfixes
Removed duplicate functions
Some functions that are used in multiple cards are now only called once, this improves performance

Extra Information

We can now do cool stuff like in the screenshots below. It is recommended when you intend to use the bottom bar slots in header card to either not use the default HA badge slots or to never fix the badges to the header in the header options. You can simply use the header slots to slot your badges.

Upcoming Features

A badge option will be added to the HKI-Badge style (we can mimic the HKI5 events in the header this way, but you can use it for other purposes as you please)
A Google Tile and a Simple button will be added. The simple button will just be an icon or icon and name centered, whereas the Google tile will look like a google tile. The simple button can be useful as remote control buttons

Release 1.1.1

Header Card

Fixes bug where we couldn’t set a closing animation for custom popups
Fixes bug where we could not set animation duration for custom popups

Release 1.1.2

Header Card

Fixed a bug where overflow settings in the bottom bar slots would not do anything.

jimz011 · February 24, 2026, 1:16am

Release 1.2.0

HKI Button Card

Added 9 new HKI More Info Popups: Automation (uses switch popup), Select/Input Select, Device Tracker, Number, Text, Event, Binary Sensor, Sensor, Person. Complete with options for Sensors and Persons
Overhauled humidifier popup, you can now add fan speed entities as well as many options from the climate popup like vertical/circular slider or +/- buttons. Gradient colors can be set for humidifiers as well now.
Added option to set a maximum of 8 custom buttons on the bottom bar of a popup. This is available for all domains including custom popup. All buttons have configurable tap actions.
Added option to hide the bottom bar entirely in popups
Removed history tab from custom popups if no entity is defined
Removed last seen message from custom popups if no entity is defined
The history tab for custom popups were missing the same styling as the other popups have, this has now been fixed
Entity Picture would not show in popups if it was selected, this has now been fixed
Decluttered the popup settings panel and sorted into different accordions
Various bugfixes

HKI Header Card

BREAKING CHANGE: Previously made custom popups will need to be removed and re-added! You can copy the old code back into the new if necessary to save time.
We can no longer set a custom popup per action type, a custom popup can now only be set once for each button (this is consistent with the button-card way popups are used)
ALL popup features from the HKI Button Card are now available in Header Card (e.g. if you set a tap_action to open a light more-info window and HKI-More-Info is selected, it will show the same light popup that button card does
Various bugfixes

Extra

If anyone uses a Midea Comfee Dehumidifier and has flashed it with This ESPHome Project, you can install the new HKI ESPHome Humidifier component. This will convert the humidifier from a climate domain to a humidifier domain. The HKI Humidifier Popup works great with this.

jimz011 · February 25, 2026, 11:31am

This will be fixed tonight, I figured out that the cards were stripping the layout code and thus would not work.

Thanks for pointing this out

jimz011 · February 26, 2026, 1:37am

Release 1.3.0

HKI Header Card

BREAKING CHANGE: Button is no longer available for use in the header slots (continue reading the notes to find out its replacement)
Header Card is no longer showing a preview in edit mode, we only see the preview when actually editing the card. This makes management slightly easier, but especially when using the header card in a normal section (not the header section). It will show a placeholder card instead (like navigation card)
Default HA layout settings are now available for this card. When we use this in a normal section (so NOT the header slot), we can resize this card to take the full width of the all the available sections. You should only use this if you intend to use the header card slots for badges/cards instead of the default HA badges section. This allows us to have much more control over where badges are placed, and doing it this way allows us to place badges at the far right (which is currently not possible). See screenshots below.
The button for top/bottom bar slots has been removed and replaced by badge. You can use this as a replacement for badges. It should be quick and easy to setup. You can add state badges to the badge (for users of the old HKI5, this will allow you to recreate the old HKI5 header). And the badges can be conditional as well!
Person slots now have the full HKI Popup Suite available
For more advanced badges/cards in the header you can use a custom card in the bottom slot instead (previous release), We have the full HKI Popup Suite for this available as well
You can now re-arrange buttons and persons without the need of removing the configuration first
All multiline text fields now support suggestions for mdi icons and entities
When a button is clickable (like weather), fixed a bug where we would not se the clickable queue on desktops

HKI Button Card

You can now re-arrange custom HKI Popup buttons in the bottom bar without removing the configuration first

All Cards

Refactored base code, many code that was duplicated in multiple cards have now been bundles and cards now use the same base code (this will improve performance)
All cards now support the HA Default Layout selector (see screenshot), this wasn’t possible in previous versions because the code enabling this got stripped after saving.
All cards now support the HA visibility settings (these got stripped as well)

jimz011 · February 28, 2026, 1:52am

Release 1.4.0

HKI Settings Card

This card is a new card!
This card will control all the visuals for HKI Elements globally. For example if you have a lot of buttons and you want to change all the button colors at once or if you want to change the border-radius or popup styles for all buttons. Well this card makes that possible. NOTE: This card ONLY works on buttons that has no overrides configured. If you have set a custom border-radius on a button/card then this card will not work on that specific button/card. When you add the card you don’t need to edit the card to use it (though the settings are available in edit mode as well).
Change the look of your dashboard real quick with this awesome new card!

HKI Header Card

Badges have now a ton of new options available to styling
Badges now use the same default icon coloring as button card
Badges support most options that HKI Button Card badges have
Fixed issue where we could not set hold/double tap actions on badges

HKI Popups

Added option to hide the top bar
Added option to hide the close button on popups when the top bar is hidden
Moved option to hide bottom bar to the features section
There is now a settings that allows you to close your custom popup whenever a button is pressed automatically (this is not on by default!)
Domains have been updated and HKI More Info is now the default for all domains that have a HKI Popup available.
The last updated tag wasn’t always updating correctly, this has been addressed
The history view would not update in real-time, this should now be fixed

All Cards

Fire Dom Event is now available from the actions dropdown and you can configure it from within the UI

HKI Freescout Component

A new component has been released for Home Assistant which integrates Freescout (ticketing system) into Home Assistant. It gives you sensors for your Freescout instance and allows you to automate on it. Note that this is ONLY useful for people/organisations that run Freescout on their server. You can find the component here GitHub - jimz011/hki-freescout: Freescout Component for Home Assistant

jimz011 · March 2, 2026, 12:24am

Release 1.4.1

All Cards

Added compatibility for HA 2026.3.x

HKI Header Card

Fixed issue where a non-removable icon would be inside the header when the datetime widget was selected

HKI Popups

The features tab was hidden when a custom popup was selected, making it impossible to hide/show the popup bars in a custom popup
The same is true for the newly added feature, perform any action to close the popup
Fixed an issue where we could not open a HKI More Info window when this action is performed from within a HKI More Info window

jimz011 · March 3, 2026, 12:03am

Release 1.4.2

HKI Header Card

Added compatibility for HA 2026.3.x (I missed this card in the last update), this fixes top/bottom bar configuration
Fixed an issue where we could not select a person entity whenever a new person was added
Fixed issue where font-weight could no longer be selected
Added option for entity override on toggle, more-info and hki-more-info actions (this was only available on some widgets like persons/weather)

HKI Button Card

Added new option to lock the button, you can either use a tap/tap action or lock it with a pin or password
You can set the amount of tries and a lockout in minutes if we exceed the number of tries (a refresh will not reset the timer)
Added option for entity override on toggle, more-info and hki-more-info actions

HKI Navigation Card

Fixed issue when selecting a Fire Dom Event action would throw errors on the dashboard
Added full HKI Popup Suite to the navigation card
Added option for entity override on toggle, more-info and hki-more-info actions

HKI Notification Card

Fixed issue where alignments could no longer be selected

Settings Card

Added new global options for Button Card and Header Card
Fixed issue where settings card would slow the view down or make it hang up, this also means the card is no longer a real card. It is now a setting hidden on your dashboard and only available through edit mode. This also hides the card entirely for non admin users (which might be a plus depending on your usecase)