design trends

Liquid Glass

Liquid Glass is Apple's dynamic material system that tints itself from background content, refracts what sits behind it, and behaves like physical glass across visionOS, iOS 26 and Mac Sequoia. It exists because static blur alone reads as frosted plastic. Real glass distorts light and picks up environmental color. Once screens hit sufficient brightness and density Apple shipped the full physics instead of the approximation.

It is not the 2020 glassmorphism trend that relied on heavy backdrop blur and neon borders. That was a visual style with no material logic. Liquid Glass is a system. The tint changes per context. The refraction shifts on movement. Every detail sells the illusion that the panel is a real object floating above content.

Do not confuse it with simple CSS backdrop filter. Most teams stop at blur and call it done. That produces a frosted window, not a lens. Liquid Glass requires an additional displacement layer or SVG filter to bend background pixels 2 to 4px. The difference is immediate once you see the before and after.

Open Photos on iOS 26. The bottom tab bar samples the dominant color in the current image and blends a semi transparent tint. Scroll the feed and the image behind the bar refracts slightly. The panel reads as a physical object instead of another UI layer. Mac Sequoia menu bars do the same trick over desktop wallpapers with calibrated contrast that still passes WCAG.

VisionOS takes it further in shared space. Windows pick up room lighting and surrounding app colors. The refraction updates at 90fps with head movement. Specular highlights track the virtual light source. The entire experience feels like actual glass you could reach out and tap.

On the web the closest approximation uses CSS color mix plus backdrop filter and a subtle distortion map triggered on scroll. It is not perfect. The web lacks compositor level access. Still the 80 percent version beats flat color overlays by a mile when executed with care.

Use Liquid Glass on navigation, sidebars, hero panels and any surface where you want to signal premium transparency and context awareness. It works especially well in media heavy products. Avoid it on dense data tables or forms where contrast stability matters more than material flair. Dynamic tints can swing too light or too dark depending on background content.

The tradeoff is testing burden. You must check contrast against the lightest expected background not the average. Parallax and refraction must respect reduced motion preferences. Overuse destroys hierarchy. Three glass surfaces with full physics is plenty. Six is visual noise.

Teams that treat Liquid Glass as a tokenized system instead of per component tweaks ship cohesive interfaces. Teams that eyeball opacity values per screen ship inconsistent junk that feels like a trend chase.

Liquid Glass succeeds because it borrows real lens physics instead of inventing new aesthetics. That grounding is exactly why it will outlast every micro trend that copies its look but not its behavior.

Related terms

Keep exploring