Adding glasseffect to new or current themes

Hello community,

as I’m using actively using Home Assistant as my new main Smart Home Server I want to drive its development forward and bring in my stuff.

I started with copying the theme “yourname” from HACS. GitHub - Nihvel/your_name: Home Assistant theme - A dark, electric blue theme that reminds the movie Your Name.
After testing several my favorit is an adaption of the Win glass effects with several color variations.

The question is:
“Are additional effects like gradients blocked by HAOS? How can I enable them?”

I tried successfully this CSS style for backgrounds:

`linear-gradient(var(--maincolor2), var(--maincolor1) 40%)`

But this does not work on the sidebar background AND not on the app-header-background of the Dashboard. It’s 100% transparent or mono color.
The ultimate goal is to bring this style on theme elements like buttons, header or whatever I want. I identify available elements by coloring them in pink, green, cyan etc first and beautify them atferwards or delete them if the colors don’t occur.

linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.15) 10%, rgba(255, 255, 255, 0.15) 50%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0.25))

I also tried some of the LCARS themes, where I find out, some elements don’t want to refresh or render correctly. And 2024 I find it really outdated so I wanted to add minimum more box shadow effects, gradients and so on to it.

My test environment are my Desktop PC, a Tablet and my Smartphone. The effetcs are neither shown on the app nor the browser on this devices.

For documentation see some pictures attached (as new user I may not allowed to add more than one picture).
glasseffect