Resources

Build with liquid glass

Ready-to-use design assets and developer resources inspired by the liquid glass aesthetic — Figma kits, CSS effects, blur presets, and UI frameworks.

Human Interface Guidelines

The HIG contains guidance and best practices that can help you design a great experience for any Apple platform.

DesignApple Design

Liquid Glass Vue

A WebGL liquid glass refraction effect project based on Vue3 + Vite.

DevGithub

Liquid Glass SVG filters

Liquid Glass effect using SVG filters

DevGithub

liquid glass studio

The Ultimate Web Recreation of Apple’s Liquid Glass UI, powered by WebGL2 and shaders. Includes most Liquid Glass features with fine-grained controls for detailed customization.

DevGithub

Glass effect playground

Glass is a new effect in Figma that allows you to manipulate light, depth, frost, and more to create dynamic elements in Figma that refract light like physical glass. This playground file will teach you how to use the effect and provide creative inspiration to have fun with glass.

DesignFigma

Flutter liquid glass

attempt at implementing liquid glass specifications in flutter

DevGithub

Liquid Glass React

Apple's Liquid Glass effect for React

DevGithub