Provide Material You palette as CSS variables

[0neGal]

Is your feature request related to a problem? Please describe.

Currently theming, in particular separate colors of a theme, is limited to separate theme options, and it has to be manually selected. With MD3 variables this can be avoided as the theme itself can use these variables for coloring.

Describe the solution you'd like

When available, Material You colors should be added as CSS variables, something akin to this:

:root {
    --system-accent1-1: ...;
    --system-accent3-100: ...;
    --system-neutral1-900: ...;
    /* and so forth, you get the gist */
}

I would attempt to make the PR myself, but I do not have an Android device that I can easily toy with, nor do I have much experience with Android Studio and alike.

Describe alternatives you've considered, if any

No alternatives are currently possible (to my knowledge)

Additional context

There are already existing themes that try to emulate the design of MD3, but again, having to have separate themes for the various colors, with those themes and this feature added, you'd effectively be able to have a proper Material You and MD3 Home Assistant app.

[dshokouhi]

I believe this may be a duplicate of #2429

Also the app already provides the color in a sensor for you to use

[0neGal]

I believe this may be a duplicate

Kind of, I'm specifically requesting the palette to be exposed as CSS variables, and not that the existing accent setting be auto adjusted.

Also the app already provides the color in a sensor for you to use

Unfortunately it only provides a single color, and not the entire Material You palette, on top of this, it is of course a sensor and therefore (to my knowledge?) not easily able to used as a CSS property value.

[jpelgrom]

I believe this may be a duplicate of #2429

As the author of that request, I believe the end goal may be the same (have a MD3 themed frontend) but we have different solutions to get there and consider the other one not good enough (something that updates the default vs a lot for you to build with). It may still be a good idea to merge them to have discussions in one place and prevent ending up with multiple 'hacks' or incomplete solutions.