2025.5 theme variable changes (alert)

[Mariusthvdb (Marius)]

I now notice my

scrollbar-thumb-color: red

in themes no longer seems to work. It isnt listed in the changed options on the opening post/release notes, but I cant make it happen.

still seems to be valid? frontend/src/resources/styles.ts at 60d457c3d94b674f1cd685fcb7e61c30db3eb9a5 · home-assistant/frontend · GitHub

Maybe it’s related to my use of custom-sidebar, but Ive always had this setting in the main core theme.

edit

setting it in custom-sidebar is also borked… probably means the variable is broken in core frontend ?
Its not working in Safari and iOS app, Chrome still show the red bar…

scrollbar-thumb-color no longer sets the scrollbar thumb in Safari and companion app

[Montreal666]

@Mariusthvdb

--ha-font-size-scale
--ha-font-size-2xs
--ha-font-size-xs
--ha-font-size-s
--ha-font-size-m
--ha-font-size-l
--ha-font-size-xl
--ha-font-size-2xl
--ha-font-size-3xl
--ha-font-size-4xl

Can someone provide an example of how/where to use these new tokens?
Trying to resize header fonts in my custom theme.
Thank you

[Ildar_Gabdullin]

@Montreal666

Can someone provide an example of how/where to use these new tokens?

Perhaps it is better to check this in the 1st place: open a forked HA Frontend code in VScode and search for a particular variable. Away from a PC myself, cannot help.

[Montreal666]

Perhaps it is better to check this in the 1st place: open a forked HA Frontend code in VScode and search for a particular variable.

Not too familiar with forking the code or where to look for the variables. Would you mind providing some pointers? Thanks for your help

[Ildar_Gabdullin]

You need to have a GitHub account to fork a repo. Suggest to google “how to fork a repo”.
See, I am not able to give you a detailed answer with screenshots since do not have access to PC.