Как реализовать эффект, подобный Liquid Glass, при помощи CSS без JavaScript и шейдеров

Спасибо, ваше решение понравилось. Единственное, в вашем примере все-таки используется JS. А можно все перенести в CSS, если делать проверку на https://caniuse.com/css-hanging-punctuation, которую пока что поддерживают только Safari-подобные браузеры

.bg-liquid-glass{
backdrop-filter:blur(4px);
-webkit-backdrop-filter:blur(4px);
...
}
@supports not (hanging-punctuation:first){
.bg-liquid-glass{
backdrop-filter:url(#displacementFilter) blur(2px);
-webkit-backdrop-filter:url(#displacementFilter) blur(2px)
}
}

Xray на Keenetic / Xkeen

Огромное спасибо! Очень тонкие настройки есть, что супер. Завел на кинетике KN-1011 в свете YT замедления, все работает топчик :)