Lovelace Card - Light with Profiles

Tags: #<Tag:0x00007f7c740402e8>

Hey there!

Just wanted to share my very first custom card for Lovelace.
I was setting up my lights and found my self missing a way to quickly change profile. After some searching without luck I took it on myself to create a custom card that could turn on lights based on light_profiles.csv (this csv file is a core file located in your config folder next to your configuration.yaml, see more on light component).

Now that I think it’s working, I wanted to share it. Maybe you been looking for something similar or maybe you have an idea to make it even better.

Here’s a small gif of the card in action (sorry for the Danish)



Nice card! But it would be better to put the profiles in a separate file. That way if there’s an update or bug fix, we can just swap out the lovelace-light-with-profiles.js with the new one.

1 Like

Going to do this for sure! Didn’t think of it. Was just sad that I couldn’t read the profile file from root :slight_smile:

Yes that would be even better indeed…

Ah this looks great, exactly what I’m looking for in my kids rooms to set full on, story time, and night light

Will give it a go

1 Like

Happy to say 2.0.0 is out.

As suggested by @Pippyn light profiles are no longer defined inside the js file but inside lovelace.yaml which makes updating the card easier.

  bright: '0.457,0.408,254'
  dimmed: '0.457,0.408,77'
  nightlight: '0.509,0.411,1'

I really like the look of this. What are the units in the light_profiles? At night I set my kids light to red, they show like this in the entity viewer:

brightness: 15
hs_color: 0.994,100 
rgb_color: 255,4,0 
xy_color: 0.7,0.3

it follows the schema from light_profiles.csv, which is x,y,brightness

@Greg: So for you thats: 0.7,0.3,15

1 Like

Awesome! Will try momentarily

(and hope I don’t wake up the kids)

1 Like

Hi Great Card.

Is it possible to have a way of using “name:” on the entity and if the light is unavailable have the switch greyed out.

If i don’t have colour lights can i use the colour temperature instead ?

And how do i find out what the x,y and brightness are ?

Edit: Found it.


anyway to get lights back to actually white. as in rgb color - 255, 255, 255?
0.323, 0.329 isnt the same with the merkury lights i have. its the colored version of it.

when i set themto 255.x.x they are actual bright lights again. cant seem to figure it out…

Where do I add light profiles section if I was using the lovelace UI editor. I tried to put that in the raw editor at the root, doesn’t work

@fiftys try 1,1,100


@ramginuga first you need to add the light_profiles.csv at the config root via configurator or ftp

only mentioned shortly in the light component:

same question as @ramginugaI. i just now noticed you updated this 10 days ago-- been using it since the beginning…however im also not sure where to add the light profiles code in lovelace.yaml.

@fiftys and @ramginuga: right after resources, same almost same format as then you needed to add it to the js file. this is just better for future updates

  - type: module
    url: /local/path/to/light-with-profiles.js

  bright: '0.457,0.408,254'
  dimmed: '0.457,0.408,77'
  nightlight: '0.509,0.411,1'


thanks. Worked for me

1 Like

your document makes no sense to what the csv file is and where it goes

@asa79 thats correct and the reason is that its a core settings file just like configuration.yaml and lovelace.yaml. My card just uses this feature not inventing it.

I now see a lot of ppl dont know about this file (light_profiles.csv) soI will add a small description of its existence in the near future.

for more info on the file for now check out light component: where its mentioned. (this is where I found out about it)

hope this is answer enough :slight_smile:

Where does the light_profiles.csv sit folder wise?