Input_boolean icon ignored in Badge

I have an input_boolean object with icon defined.

    name: House is occupied
    initial: off
    icon: mdi:home-account


The icon is shown everywhere but in Badge.
Am I doing something wrong or is it known issue?

The icon also doesn’t change color when changing state. I’ve read some posts about it, but those are pretty old. Is this behavior intentional in HA?

with regards

Input booleans displayed as switches by default.

If you want one to display as a badge you are going to have to take control of Lovelace. Click on the top right-hand three dots menu and customise the UI. Then edit the view by clicking on the pencil icon next to the view you want the badge to appear in. Then click on “Badges” in the card that pops up and add your input boolean to the entities list of badges.

Form now on new items will not be automatically added to your frontend and you will have to specify where they go. You can find them in the same three dots menu listed under “Unused Entities”

I have no problems with adding the input_boolean to Badges. In fact you can see one (House Occupancy) on my picture.
The problem is the badge doesn’t show defined icon. It shows on or off text instead. It cannot be even forced editing yaml:

title: Domov
  - badges:
      - entity: binary_sensor.updater
      - entity: person.michal
      - entity: person.barus
      - entity: input_boolean.house_occupied
        icon: 'mdi:home-account'
        name: House Occupancy
      - entity: sun.sun

Oh sorry. I completely misread your post. Not sure how to do that. Maybe a template binary sensor with an icon template used for the badge?

I’m facing the same issue. Input_boolean is far simpler to configure compared to a template sensor. I’ve defined a custom icon in customize.yaml as per below and still the badge shows up as an ugly on / off. Surely this is a bug?

    icon: >
      if (state === 'on') return 'mdi:lightbulb-on';
      return 'mdi:lightbulb';
    icon_color: >
      if (state === 'on') return 'rgb(251, 210, 41)';
      return 'rgb(54, 95, 140)';
1 Like

Just to add to this, turns out you need custom-ui installed for my example to work in cards. Badge still doesn’t work.

I’ve tried a template switch and this doesn’t work for the badge either.

Still an issue a year later. But now, if you have icon defined, it’s changed to showing the icon as well as the state text:

By making the badge larger you can see:

W/o Custom UI, an input_boolean entity which does have an icon is showed w/o the icon in a Badge.

You may call it a bug but I think this is a feature.
Same is about a switch:

If you see an icon with the text, probably this is happening because of Custom UI.
According to my not-long-term observations, Custom UI sometimes is making an unexpected influence to HA.

How to delete the text from a badge in you case?
Try using card-mod.
Go the the corresponding thread and find a post about styling badges.
Then try to adapt some style to your case.

Thanks for the reply! But this is not part of custom UI, it’s now part of badges
Maybe something is interfering with it, I will have to test with a vanilla system.

Sure, displaying the state instead of the icon is more useful. But they don’t look pretty at all. What would be nice, is if someone gave the badges a little love, like the rest of Lovelace. Maybe if the icons changed colour when on, like in the rest of lovelace. Until then, we will have to use more hacky methods :upside_down_face:

Sorry yes I am using card-mod and I did a search for posts in it’s thread which had badges and icon but it didn’t turn up anything.

I do not think so.
I think that these options simply do not work.
Just add these badges in “raw editor” to some view:

      - type: state-label
        entity: sun.sun
        show_icon: false
        name: sun
      - type: state-label
        entity: binary_sensor.updater
        show_icon: false

The 1st icon still shows a name, the 2nd - an icon.

1st post → my consolidation post → post about badges → invent smth based on these styles

Was discussed:

In the linked docs there is an option for icon, so it’s not part of custom-ui.
icon string (optional)
Overwrites icon or entity picture.
Although this implies it’s to change an icon not add but the behaviour of it is to add an icon as well as the state value.

I’m not sure where you’re going with this example? I don’t want to hide the icon, but good point in showing this option not to work. Also, this domain doesn’t show the state label like a switch or input_boolean does.

Ah found it, thanks. Looks as though the state text and icon can’t be styled differently from my tests. I tried using display: none; but this hides both. This is the full code I used:

      - entity: input_boolean.central_heating
                $: |
                  .value {
                    display: none;
        icon: mdi:radiator

OMG, test it by yourself.
Here is an example for input_boolean:

      - type: state-label
        entity: input_boolean.test_boolean
        show_icon: true
        name: input_boolean

No icon displayed.

Icon’s don’t display on certain domains. Icons show no matter what for others. Plain and simple. The option to show/hide icons in badges may or may not work depending on the domain. It’s been like this since day 1. Is it a bad design? Sure, make a feature request to change the behavior, however it’s working based off it’s original design 6+ years ago.

Anyways, this whole thread could be avoided if you just make a template binary_sensor and be done with it. It’s super simple now and the literal years spent in this thread could be solved with a simple template.

- binary_sensor:
  - name: Security Light
    state: "{{ is_state('input_boolean.garden_security_light', 'on') }}"
    device_class: light

I doubt anything will change with badges anytime soon, it’s clear that home assistant has been trying to phase them out. Not to mention, they can be easily replicated with button cards, glance cards, etc.

Seems so, and for me badges are not needed at all…

Same boat, as are most people. Just look at anyone who shares an interface… no badges. It’s a byproduct of the original interface prior to lovelace. I’m very surprised they still exist.

From what I remember the template sensor had the same issue with the state being displayed and not the icon.

So basically what you’re saying is, you don’t use them, you don’t know anyone who uses them, no one should use them. :unamused:

I like the way badges sit at the top of the page and spread across wider than the normal card width. They don’t interfere with any other cards either. My first three cards sit nice alongside each other on the desktop view, if I add another small one before them it will look uneven.

If they’re trying to phase them out why doesn’t it say so in the docs? Why not just deprecate them already and save people time messing around with a feature that doesn’t work.

Guess I’ll just have to look other ways to arrange everything seeing as Badges are frowned upon around here…

I said template binary sensor which behaves the same as every binary sensor (that’s the domain). I.e. it will show the icon like you want.

I didn’t say no one should use them. I said you shouldn’t expect changes to them. Historically, they have been forgotten because the majority of people don’t use them and there are other options that have similar affect.