Жидкое стекло в вебе: Canvas, WebGPU и никакого CSS-blur 💧
Экспериментальная liquid-dom создаёт эффект жидкого стекла поверх HTML с помощью Canvas и WebGPU/WebGL.
Вышла крайне любопытная библиотека liquid-dom, которая позволяет создавать честный эффект жидкого стекла (Liquid Glass) прямо поверх вашей разметки.
Это не просто хитрый backdrop-filter: blur() в CSS, а полноценная симуляция жидкости. Библиотека считывает HTML-структуру страницы, переносит её в Canvas и использует WebGPU/WebGL для рендеринга физически корректных преломлений, бликов и капель в реальном времени.
Технология пока экспериментальная, API может меняться, а для полноценного продакшена время ещё не пришло. Но как демонстрация того, на что способны современные графические API в браузере — это восторг.
Исходники на GitHub
Позалипать в демки
Как вам такой UI-тренд? Нашли бы применение такой тяжелой графике в реальных проектах (например, на промо-страницах) или CSS-размытия пока более чем достаточно? 👇