Add color and icon to the CalendarEntity

[Misiu]

The goal

be able to specify color and icon per calendar.

Current situation

we are unable to specify color and icon per calendar

Currently, we are unable to set color and icon per calendar.
It has been requested multiple times:
https://community.home-assistant.io/t/google-calendar-color/278352
https://community.home-assistant.io/t/calendar-add-on-improvements-color-and-calendar-selection/523407
home-assistant/frontend#5975
home-assistant/frontend#11262
https://community.home-assistant.io/t/google-calendar-respect-color-individual-calendar-coding-in-google-calendar/523404
https://community.home-assistant.io/t/local-calendar-enhancements/510905
https://community.home-assistant.io/t/choose-custom-colors-for-calendar-google/391003
https://community.home-assistant.io/t/google-calendars-settings-colors-for-tags/435449
https://community.home-assistant.io/t/adjusting-colors-google-calendar-integration/461751

Proposal

Add color property to CalendarEntity and expose Color and Icon in Config Flow for local calendars (I didn't check other calendar types and APIs, so I'm not sure if, for example, Google returns calendar colors)
CalendarEntity extends the Entity class which has the Icon property, but the color should be a CalendarEntity property.

[frenck]

colors are not part of entities in Home Assistant in general. Icons, however, are. Calendar entities can already have custom icons and provide icons. Nothing is needed for that. Could you explain what I am missing?

Additionally, your question about exposing icons in the config flow, is not part of the architectural discussion (it is an integration-specific thing) and also not part of an integration option (thus should not have to be in the config flow).

I'm not sure if making an exception for adding colors in a single type of entity makes sense tbh.

../Frenck

[Misiu]

The idea is quite simple:
I'd like to be able to specify color per calendar. I searched and found that others have the same problem - this currently can't be done.
I'm migrating from https://github.com/bruxy70/Garbage-Collection to the local calendar and thought it would be good to be able to specify the colors of calendars the same as are on trash bins.
For some reason Google added color pickers to their calendar:

Calendar entities can already have custom icons and provide icons. Nothing is needed for that. Could you explain what I am missing?

Ok, I found this, we can set icons for entities (calendar is an entity), but the calendar view isn't showing them. This is a frontend issue, I'll address it there.

colors are not part of entities in Home Assistant in general.

I agree with that, but if this won't be a property of CalendarEntity then this won't work right? The color must be persisted not only in the browser)

[Misiu]

@allenporter as you created the local calendar I'd like to ask for your opinion.
Google has API to get colors (https://developers.google.com/calendar/api/v3/reference/calendarList/list?hl=en), so if we add support for colors, then not only local calendar can benefit.

[frenck]

Please withhold from pulling people into conversations. You might have the right intentions, but is may come across as demanding their attention. Thanks 👍

[allenporter]

FWIW I've been reading this discussion in my inbox and didn't have anything to add beyond what was said already by @frenck

(Similarly i've seen home-assistant/core#88339 and am not feeling super excited about it in the current form)

[frenck]

So, got a question on Discord related to my comment too.

Let me start with: I'm not against it, but I'm not sure if it makes sense to put colors on calendar entities only.

There are some concerns, in general, to take into account. For example, themes and theme colors. The chosen background color may be problematic with the colors provided, the light entity already has these issues (and works around it partially).

On the other end of the spectrum, it might make sense to apply a "color" (or colors) to all entities. The reasoning for that originates from the general design overhaul taking place right now. Take, for example, the new tile card, having colors on the entity level might be a good fit for that.

But it is not just the tile card, entity colors are in many more places nowadays.

Looking at the recently introduced state colors for entities, a color setting like the suggested might conflict with that. What would be the difference in the color of the entity when the calendar entity is on or off? And if we provide colors on the entity level, what would that mean for entities having different state colors for their different states?

Hope this makes my train of thought clearer, why I think adding color to a calendar entity might sound great from the "Calendar" perspective, but might need more tinkering/UX from a full Home Assistant perspective.

../Frenck

[allenporter]

This matches my view. I'd like to see a proposal here that considers the broader implications. In my own home assistant instance i see various colors in the UI for entities in graphs and things or various colors on cards and such and so having a one-off for calendar isn't immediately obvious to me as an answer here.

[Misiu]

That's why I started this discussion. I have a use case, but I don't have the knowledge to be able to say whether adding a color property to CalendarEntity or Entity is a good or a bad idea and what consequences it might have.
Adding color to Entity would open a lot of possibilities, but it also brings a lot of questions.

Hope this makes my train of thought clearer, why I think adding color to a calendar entity might sound great from the "Calendar" perspective, but might need more tinkering/UX from a full Home Assistant perspective.

Sadly I can't say much about UX and the internals of Home Assistant, but at least we are talking about possible change.

[jonkristian]

I kinda disagree with the basis of those arguments about possibly themes not working with the colors in the calendar or that it might not look good, because there are several ways to account for that when styling, and wouldn't it be up to the theme authors to make the appropriate styling to account for these changes? State on/off and how colors work is probably up to the theme, but one idea could be using rgba to determin brightness... or these days you could use css filters.

Also I just noticed this, but it seems the official calendar card doesnt even work with the colors from the calendar because they are determined just by index and by selectively adding calendar entities (which you can) those indexes will shift and then provide the wrong color.

[robloh]

I tried to thing of a more broader use and the only thing I could think of was color for entities could be really helpful with graphs as well (for all entities). But perhaps that's better solved on the graph cards.

On the other hand I do find colors on my iOS calendars extremely helpful with 6 calendars to quickly see at a glance what's important and what's not, just by color. So I think there's definitely a use case for calendars.

Perhaps this is a silly thing to mention, but of course certain light entities can have color as well ;)

[sym0nd0]

Just to add to the convo, I would love to see something like this (not mine) from the forum https://community.home-assistant.io/t/local-calendar-enhancements/510905.

Like many, I'm just now moving over to Local Calendar following the Garbage Collection customer integration being deprecated, due to Local Calendar having most of (if not all of) the same functionality. No problem there for me, Local Calendar works really well. I'd just like to be able to choose the colour associated for each calendar myself (mostly as I have four bins and would like to match the calendar colour to the bin...yeah, daft I know 😂).

I think the addition of Material Design icons, maybe utilising the same icon picker like with entities, and user definable colour (colour wheel, hex or the like) would fit with the way HA UI has been progressing over the last couple of years.

All that said, I am totally ignorant to just how difficult to achieve this simple idea would be.

[Brtrnd]

Hi
Calendars already have colours, but you can't pick the color you like. I believe allowing users to choose the colours is not a large change.
Please see my reply in this topic: https://community.home-assistant.io/t/google-calendar-color/278352/11 where I propose to change line 148 of of this file to include an if statement
.map((eid, idx) => ({
entity_id: eid,
name: computeStateName(hass.states[eid]),
backgroundColor: hass.states[eid].colour if (hass.states[eid].colour) else getColorByIndex(idx) ,
}));

I don't think this would break stuff that would already be broken with the default colors, but it would add consistancy between my google calendar and homeassistant.
But I'm not a coder and I'm not an expert.

[averater]

Is there any progress? I think it sounds Great to have colors for all entities. I have been missing that. Especially for lights where the blue icon and a blue light on looks similar.

If there is a separate pr for adding colors then please linkt it.

[blubkens]

I ran into the same issue as misiu.
The wife uses pink, myself blue and shared is green.
In HA my wife is blue, i’m pink and shared is light blue.
Colors are there but assigning them is not possible.
Would love to have the calendar on the dashboard but at the moment it’s not usable for us.

[jprocket45]

well, I half to agree with colors in calendar sadly I would love to use HA for everything but my wife disagrees if she can't color code the calendar where not using any calendar inside HA seems a lot of people have issues with this... So I guess I am stuck using actual google calendar.

[doctorkb]

It isn't completely native, but https://github.com/FamousWolf/week-planner-card lets you specify colors for each calendar.

[KGS501]

One problem I am seeing in this conversation is, that it seems to be a big change to add some sort of color to the entity itself like a native property. Maybe it would be an idea to use some sort of attribute of the calendar entity to assign color. Attributes are in my experience quite versatile and not standardized, so a simple color: rgb(255,0,0) or something like this as an attribute, which can be edited by the user through some sort of frontend ui might be a more feasible way of implementing this, as I personally think too, that this implementation would be very helpful to distinguish different calendar events from multiple calendars at a quick (and more importantly for the specific user more intuitive) glance

[doctorkb]

The biggest issue with not doing it is that it results in inconsistent behaviour. If I create three Calendar cards, the first two with one calendar entity each, and the third with both of those calendar entities, the first two cards will have blue items for their entity. The third card will have blue and purple items.

For a UX that matches what people have become used to with other productivity tools (gCal, Outlook, etc.), that second entity should always be purple (in this particular example) and not change colours based on the order in which it happened to be listed in a display model. This issue becomes much worse when we're not talking about two calendars over three cards, but a dozen or so (personal and work for a few family members, plus others for extracurricular activities).

[CMDR-Sloma]

So, got a question on Discord related to my comment too.

Let me start with: I'm not against it, but I'm not sure if it makes sense to put colors on calendar entities only.

There are some concerns, in general, to take into account. For example, themes and theme colors. The chosen background color may be problematic with the colors provided, the light entity already has these issues (and works around it partially).

On the other end of the spectrum, it might make sense to apply a "color" (or colors) to all entities. The reasoning for that originates from the general design overhaul taking place right now. Take, for example, the new tile card, having colors on the entity level might be a good fit for that.

But it is not just the tile card, entity colors are in many more places nowadays.

Looking at the recently introduced state colors for entities, a color setting like the suggested might conflict with that. What would be the difference in the color of the entity when the calendar entity is on or off? And if we provide colors on the entity level, what would that mean for entities having different state colors for their different states?

Hope this makes my train of thought clearer, why I think adding color to a calendar entity might sound great from the "Calendar" perspective, but might need more tinkering/UX from a full Home Assistant perspective.

../Frenck

Correct me if I am wrong here, but I find that your perspective comes from the coder point of view and the explanation is really technical, which really does not interest me as a user. I don't want to come as rude or anything, so in other words, I'd just love the option to customize colours of the calendars or colours within home assistant easily. From a technical point of view, I will take any solution that will work for you as long as the solution will allow me to achieve what I want. It's just at the moment the way it works is terrible, sometimes you end up white text on yellow background because HA decided to assign these two colour pairs arbitrarily to a new calendar I created.

I think at the moment colours in themes / calendars are completely "broken", there is no easy way to change them except for tinkering with yaml (themes) which, from my perspective, is not an easy task.

I hope this makes sense.