Apple представила новый визуальный язык Liquid Glass

В недавнем посте я не упомянул о технических аспектах, и теперь исправляю этот пробел. Последние годы в дизайне интерфейсов преобладал минимализм, однако Apple решила изменить правила игры, представив Liquid Glass, который добавляет визуальную глубину и материальность.

На первый взгляд, это просто эффект полупрозрачного стекла, но на самом деле Liquid Glass переосмысляет взаимодействие с цифровой средой. Интерфейсы должны ощущаться, а не просто функционировать. В статье я расскажу, как создать аналогичный интерфейс без сложных npm-модулей и шейдеров.

Основные элементы Liquid Glass включают полупрозрачный фон, размытие, мягкие тени и аккуратные анимации. Этот стиль можно создать с помощью простого CSS и SVG-фильтров, что позволяет добиться эффекта «текучести» без перегрузки видеопамяти.

Для применения Liquid Glass достаточно добавить класс .bg-liquid-glass к любому элементу. Этот эффект не только украшает интерфейс, но и улучшает визуальную иерархию, повышая комфорт взаимодействия. С учетом растущего тренда на «живые» поверхности, сейчас идеальный момент для внедрения Liquid Glass.

Понравилась статья? Поделиться с друзьями: