▌ GitHub-радар
Liquid Glass для веба: эффект Apple на React
React-компонент без зависимостей, воспроизводящий Apple Liquid Glass в браузере — как живую линзу, преломляющую реальный DOM, а не застывший скриншот поверх контента. Текст выделяется, ссылки кликаются, работает в Chrome, Firefox и Safari включая iOS.
Liquid Glass — React-компонент без зависимостей, воссоздающий фирменный Apple-эффект стеклянного преломления для веба — не как застывший скриншот поверх контента, а как живую линзу, преломляющую реальный DOM. Секрет — в SVG-фильтрах смещения с растеризацией знакового поля расстояний, которые дают хроматическую аберрацию и преломление без потери интерактивности элементов. Работает в Chrome, Firefox и Safari включая iOS с тремя режимами: преломление на месте, отдельный контент через prop и WebGL для видео и canvas.
Зачем это вайб-кодеру
Если вы делаете лендинг, портфолио или приложение и хотите тот самый полированный Apple-стиль — вот как сделать это правильно, не ломая интерфейс. Раньше кросс-браузерный стеклянный эффект означал либо только Chrome, либо замёрзший контент под стеклом; этот компонент решает оба ограничения сразу и легко встраивается в любой React-проект.
Ещё находки