Lovelace: Button card


I’m really not sure since I don’t use the other one but up thread there was some talk that this card is a lot more full featured.


The reason I use it is because you can change the colour of a button for on/off for an input_boolean…


I searched through this forum thread but didn’t find any info on how to use local-lit. Could you share when you get a chance?


You don’t need to anymore… The card has been updated to not require an external lit - it is now using the one in HA.


Gotcha. I was hoping the new update would mean that the button card would work on Amazon Fire tablets running Fully Kiosk Browser, but it still doesn’t load (even after clearing cache). Anyone else have better luck?


I’m getting an error, randomly appeared a few days back.
Running Hassbian, v85.1
Redownloaded the latest .js file,but error persists?
I have this at top of ui-lovelace.yaml

  - url: /local/button-card.js
    type: module

And this is the relevant part of the yaml

      - type: horizontal-stack
          - type: custom:button-card
            color_type: icon
            entity: light.bedroom_light
            action: toggle
            name: Main Light
            icon: mdi:floor-lamp
            #color: rgb(255, 131, 0)
          - type: custom:button-card
            entity: switch.bedside_lamp
            name: Bedside Lamp
            #color: rgb(255, 255, 0)
            action: toggle
            icon: mdi:lamp
            #size: 82%
            color_type: icon
            color: rgb(255, 208, 0)

What am I doing wrong?


If you didn’t already, you need to delete data and cookies - all site data and refresh a few times… Even after I updated my card, it didn’t update till I did this… It is just a browser issue.


@kuuji Would it be possible to assign a hold_action to this in the future? That would be awesome as it would make the interface be a little more like Apple’s Homekit.

Great work btw, I use this card for all my buttons, one of the best custom cards out there.


there is currently an open pull request trying to add this feature:


You saved me @simbesh this actually works (and so far it works even better than the hold_action with the original entity-button cards). Thank you so much.


Is there an FAQ explaining the difference between this card and the official ha entity button card?


Check the github page for the button-card.

There are a lot of differences between those cards. The button-card is much more flexible. Also the button card has “empty” buttons so buttons won’t get stretched if you desire to have less buttons.

Example in my screenshot:


This card should really just get used to completely replace the core card…


I agree Dave. In some of the discussion above when the core card was made, it appears to me at least that the core Devs won’t permit some of the functions provided by this card. Classic example: they won’t show the on/off state for an input_boolean because they reserve the yellow colour for power… Would be great if that was supported in the core card and you could configure the colour but nope. I believe there is other stuff they don’t want to support so it’s a custom-card.


The custom cards aren’t so bad, but core would be great. For now we’ll just use this. They work well and if you modify the code a bit you can even have a hold_action on this card like the official entity-button has.


I’m sorry to bump this but I would really like to know how I can make my Harmony commands button using this custom card (instead of having to create script for each command and point to it…)
This is how it work with standard button card:

  - type: entity-button
    entity: remote.harmony_salon
    icon: mdi:volume-plus
      action: call-service
      service: remote.send_command
        entity_id: remote.harmony_salon                
        device: "60012590"
        command: "VolumeUp"

How can I recreate this with this cstom button card?
Tried this but it doesn’t get the “command” part:

  - type: "custom:button-card"
    entity: remote.harmony_salon
    icon: mdi:volume-plus
      domain: remote
      action: send_command
        entity_id: remote.harmony_salon                 
        device: "60012590"
        command: "VolumeUp

Am I missing a space or quote somewhere?

Thanks in advance guys :slight_smile:


I think you are looking for something like this?

Or this:


Not really. Can look much better with this custom card imo.
Yes, I can do picture element and work with that I guess as well… that might be a good idea.

But for my preference, i would really like to use this custom card (already do but calling scripts for each command) I just need to find out the right format to configure the harmony remote service with the command parameter.


ah yeah, true with this you can make beautiful buttons, however I need to call services for my scenes as well (and it is a pain in the *** to do this for every button, but I haven’t found a way around it. It would be nicer if the button could just have a turn_on option instead of just toggle, but I’m no programmer so I’m not sure if something like that would even be possible). Unfortunately I don’t have a Harmony so I don’t know if there is a service call available for that, but calling a service with servicedata would probably look a bit better (code wise) than to call the script.turn_on service (at least I’m guessing that you call the script service to activate those scripts right?)


Can you share your code?

Also, what theme is that? Beautiful setup.