Light Entity Card

Light Entity Card



  • Works on any light and switch based entity
  • Toggle on/off
  • HS Color wheel
  • Color temperature and white value support
  • Support for configured language
  • compact card support for grouped entities


- type: custom:light-entity-card
  entity: light.downstairs


Name Type Requirement Default value Description
type string Required custom:light-entity-card
entity string Required The entity name of the light entity to control
group boolean Optional false Compacts card

Added support for groups, switches, and compact mode.


added support for custom effects_list from input_select entities

1 Like

Trying to get this card working but it seems to have an issue with other custom cards.

If I try to open the this custom card I get the following in the GUI:

and this in the error log:

https://xxxxx:8123/local/custom_ui/light-entity-card.js?v=1.2.0:1:1 Uncaught SyntaxError: Identifier ‘LitElement’ has already been declared

Latest version is 1.3.0 try that one

Unfortunately I get the same result:

https://xxxxx:8123/local/custom_ui/light-entity-card.js?v=1.3.0:1:1 Uncaught SyntaxError: Identifier ‘LitElement’ has already been declared

note: this card is currently inside another custom card (custom popup), but I did notice that the error comes up in the log as soon as I log into HA, before even navigating to the page that has this card on it. That was after a browser cache clear

This error comes from another custom card incorrectly defining LitElement using let/const instead of var. I can change to code to fix this but there are a number of other cards out there that wouldn’t work either. Not sure how many custom cards you have but I would try commenting out all of the ones in resources except this one and see if it works. From there enable one custom card at a time to see which one is misbehaving. I’d be interested to know because the dev needs to know his card is not configured correctly.

My guess is that it’s this one… but I’ll have to do the testing that you mentioned to be sure as I have a fair few custom cards, but in saying that, most of them are from Thomas.

I looked at the code for that one and it’s not that one. I’ve used a lot of Thomas’s cards and they tend to be setup correctly so I would be surprised if it’s one of his.

Other than Thomas’s, I have the below ones:

ok I updated the card to avoid issues from other cards. Try version 1.3.1 and let me know if you have any problems. I looked at some of the cards you referenced that I dont use myself and they looked fine. It’s definitely something that’s defining LitElement incorrectly just not sure what.

Champion! That works perfectly and doesn’t spit out any errors. Great work and thanks for helping with the issues I was having :grinning:

Love this project. I just got it working, but having problems with my effects list. I tried using input_select and also tried listing all of my effects, but no matter what it doesn’t show up. I’m not getting any errors and the color wheel and brightness slider are working perfect.
Any ideas?

Thanks for the work you put into this and sharing it with everyone.

Can you give an example of your input_select config and lovelace config for this card? Are there any errors in the console?

not getting any errors.

lovelace config 1:

 - type: 'custom:light-entity-card'
   entity: light.led_144
   persist_features: true
   effects_list: input_select.144_led_effects

lovelace config 2:

 - type: 'custom:light-entity-card'
   entity: light.led_144
   persist_features: true
     - "Christmas"
     - "Candy Cane"
     - "Holly Jolly"
     - "Valentine"
     - "Lovey Day"
     - "St Patty"
     - "Easter"
     - "USA"

input_select config:

name: ‘144 LED Effects’
- “Christmas”
- “Candy Cane”
- “Holly Jolly”
- “Valentine”
- “Lovey Day”
- “St Patty”
- “Easter”
- “USA”

I have tried both ways and I don’t get any errors either way, but my effect list doesn’t show up.

The problem is caused by line 301:

      if (this.dontShowFeature('effectList', stateObj)) return html``;

If you rework it like this:

      let effect_list = stateObj.attributes.effect_list || [];

      // if we were given a custom list then use that
      if (this.config.effects_list && Array.isArray(this.config.effects_list)) {
        effect_list = this.config.effects_list;

      } else if (this.config.effects_list && this.hass.states[this.config.effects_list]) {
        // else if given an input_select entity use that as effect list
        const inputSelect = this.hass.states[this.config.effects_list];
        effect_list = (inputSelect.attributes && inputSelect.attributes.options) || [];
      } else if (this.dontShowFeature('effectList', stateObj)) { 
        return html``;

it should work

If thats the problem then HA is not computing the correct features list for those entities or the light entity is not configred correctly. I’ll try to see if there is a way to include it anyways without breaking other functionality. The problem is when you include group entities custom effect_lists will show up for all of them. I’m on the fence about this change for this card as what’s really happening is HA isn’t giving the correct feature list or some people are misconfigured.

Make sure you have effect: true on the light component so HA knows this entity has the effect_list feature. For my mqtt based light:

- platform: mqtt
  schema: json
  name: "LED Strip"
  state_topic: "bruh/porch"
  command_topic: "bruh/porch/set"
  effect: true
  color_temp: true
  - Rainbow
  - Rainbow With Glitter

Got it working. I was using the DrZZs version of the Bruh LED strip. After I uploaded the Bruh LED strip my Card is now displaying just like it should.

I’m not saavy enough with this stuff to know why 1 sketch works and another doesn’t, but that’s what happened.

Thanks again for the time and effort you put into this.

Take care

Updated card to v2.0.0 from a breaking change in upcoming HA v0.88. No config changes needed.

Is there a way to disable the color wheel? I have a couple of switches that control Hue light groups that have just white lights in the group, but the color wheel still shows up. When controlling a single white light, it appears as is should, without the wheel.