New update LIQUID GLASS jellyfin theme glassmorphism [10.11.x]

[Ted Hinklater]

It already is?



but if you're just asking in general, this theme uses a ::before layer over .backgroundContainer.withBackdrop with css that blurs anything beneath it:

Code:

#reactRoot:not(:has(.skinHeader.semiTransparent)) > .backgroundContainer.withBackdrop::before {
  backdrop-filter: blur(30px) saturate(80%) brightness(60%);
-  webkit-backdrop-filter: blur(30px) saturate(80%) brightness(60%);
}

You can do it that way or you can apply a blur to the backdrop itself on the homepage

Code:

#reactRoot:not(:has(.skinHeader.semiTransparent)) > .backdropContainer > .backdropImage {
  filter: blur(30px);
}