Takeaways from the new iOS UI design announcement: Liquid Glass

WWDC dropped some serious eye candy this year — and yes, we’re talking about Liquid Glass.
Alongside iOS 26, Apple’s Worldwide Developers Conference (WWDC) revealed shimmering new design material that’s already dividing opinions among web designers.

Some folks love it. Others… are still making up their minds.

Liquid Glass doesn’t overhaul the entire iOS experience but gives your app icons, nav bars, and home screen a glossy new vibe. Think of it less as a redesign and more like a sleek new outfit for your iPhone.

Let’s look at what Liquid Glass is and how you should use it. Here are the highlights:

Liquid Glass unifies the look and feel of all Apple devices and operating systems. Apple’s proprietary apps and corresponding app icons have also been updated to Liquid Glass.

You might say it’s the next evolution of the glassmorphism trend. The characteristics of both are relatively the same. And Microsoft has only been too happy to remind the world of its own glassy past:

There are two key differences, though. The first is that Liquid Glass is not meant to reskin the entire UI of Apple devices or iOS apps. The other big difference is how smart (i.e., intuitive and adaptive) Liquid Glass is when it comes to layering, interactivity, and motion. 

Since the announcement, Apple’s representatives have said this will be a new era for Apple devices in terms of how they look and feel. The new aesthetic and functionality aims to make users’ devices and apps feel more fluid, immersive, and organic. 

In fact, Apple (and, really, the web as a whole) was overdue for a massive overhaul. 

In the late 2000s, skeuomorphism reigned supreme. It was a great way to bridge the gap between the world that consumers were slowly leaving behind for more digital experiences. This design trend lasted for about five years before people got tired of the real-world-inspired aesthetic.

It wasn’t a surprise when flat design emerged as the go-to design trend around the mid-2010s. With a flat UI, minimalistic design, ample white space, and vibrant color schemes, flat design ushered in a new style for the Internet. 

We’ve seen some other UI design trends pop up occasionally, though most haven’t had serious staying power. Google’s Material Design was one of them. Flat design 2.0 combined Material Design and flat design. Neumorphism had its day (sort of). Some designers have also played around with glassmorphism. 

Although glassmorphism didn’t seem like the most popular design trend, it’s been around for a while, and the new iOS UI design suggests it may very well become one. 

With Apple unifying the UIs of all its devices and investing heavily in Liquid Glass, it’ll be interesting to see what this does to the look of the web as a whole. 

Liquid Glass is a digital meta-material that bends and realistically shapes light and moves like liquid.

Apple published a 20-minute video introducing the new iOS 26 aesthetic. Let’s review what’s changed and how it affects your app design strategy.

Liquid Glass is not a UI, per se. It’s a new aesthetic for the functional top layer on iOS devices and within apps. 

With rounded corners to match the rounded edges of iOS devices and applications, Liquid Glass components more naturally nest within these spaces.

Liquid Glass can be applied to layers like: 

Essentially, Liquid Glass is a way to make an app or device’s key functions stand out without taking up space or hiding the content underneath.

Apple emphasizes this a lot. Because Liquid Glass components are translucent, Apple believes this will give applications a more spacious feel as content is never fully hidden.

Pro tip: Use Liquid Glass for functionality and primary actions.

Apple designers did not envision Liquid Glass being used for the main content within an app. So, if you’re worried you’ll have to redesign everything from scratch, you can sigh in relief. 

Here’s why Apple continually stresses the idea that Liquid Glass should only be used for floating layers like navigation, buttons, and toolbars: 

When every component rises up from a flat background, it’s difficult to know what to focus on. Ultimately, the content should remain flat and embedded within your app. The floating layers offer your users a fast and convenient means for controlling the experience. 

Liquid Glass has two variants. When setting up your floating layers, you’ll need to decide which one to use. Don’t try to combine the two—pick one or the other and stick with it.

The Regular variant is the one you’re going to use the most as it’s adaptive. 

The Regular variant: 

The Clear variant is the one you’ll need to be more selective about using. 

The Clear variant is: 

Because of this, you have to be mindful of where and when to use this variant. For instance, Apple suggests using these layers over media-rich content. 

To ensure the labels on your layers are legible, you’ll likely need to make them bright and apply a dimming layer so they stand out. However, if that dimming layer compromises the content beneath, you should use the Regular variant instead.

When designing with solid menus, buttons, and toolbars, there’s not much concern that the content on these layers will be legible. Unless you’ve created a ghost button with a hollow inside, legibility isn’t a problem so long as there’s good contrast between the component background and the text color. 

Liquid Glass adds semi-transparent floating layers to your interface. One of the alluring things about this aesthetic is that you can see hints of what’s behind it. However, that can create issues with legibility, so to address this, Apple has made these layers adaptive. 

Smaller Liquid Glass layers automatically adjust to the background. In this screenshot, we see how the layers look different as they pass over a dark part of the app and simultaneously over a light portion of it:

The color of the labels themselves can also change. In the following example, the originally black labels have turned white as they pass over the graphic. Moreover, the layers have more opacity to ensure that the darker, busy background doesn’t interfere with the text or icons on top. The opacity will reduce as they pass over light content again.

Bigger layers like menus, docks, and sidebars are a different story. Apple has programmed these layers with a greater degree of opacity:

This makes these layers—which have much more content than smaller ones—look as if they’re made with a thicker, more substantial material, which improves legibility.

Like glass and water, Apple has designed Liquid Glass to react to light similarly. 

By the way, this part of Liquid Glass can be difficult to demonstrate with photos alone. So, if you want to see the light effects, watch the intro video from Apple. 

Unlike glassmorphism, which gives UIs a glassy or frosted look, Liquid Glass brings these glass-inspired layers to life with light. 

Liquid glass uses and responds to light in different ways. For starters, light bounces off Liquid Glass layers the way we’d expect it to in real life. The layers bend, shape, and concentrate light. As a result, you’ll see light sources shine against the sides of the meta-material or travel around it. 

What’s especially neat is that, in some cases, Apple has programmed lighting to change based on the device’s motion or angle.

In addition, these Liquid Glass layers illuminate from within when touched or clicked. 

This illumination can make your interactive layers feel more responsive and lively. 

Liquid Glass has a gel-like quality. So it doesn’t just look glassy or respond as a shiny flat surface would in the real world — it also responds the way a liquid would if you touched it. 

Apple describes Liquid Glass’s gel-like flexing and fluidity as “satisfying.” Not only do these layers appear to move smoothly and effortlessly, but they also move in tandem with your touch.

Moreover, when these layers aren’t being interacted with, they go into a state of rest, fading into the background. When you interact with the component, it comes to life, lifts up, and responds to your touch. 

One of the biggest concerns that people have about Liquid Glass is accessibility. We’ve looked at how Apple has addressed this already, with the variant options and background adaptivity. However, that’s not enough for some designers.

If you want to enhance the accessibility of your Liquid Glass components, you can enable a system-wide setting. 

When activated, this setting will automatically do the following: 

This setting will modify all of the Liquid Glass materials in your app. 

It’s not just the floating layers that are getting a new look. So are iOS app icons. Apple’s designers combined properties from Vision OS and actual physical glass to develop the latest style for the icons. 

These new Liquid Glass icons will have the following traits: 

Just like in-app Liquid Glass components, light will bounce off the edges of your icons, whether they’re in the app store or on your users’ home screens.

Here’s an example of these icons in the light monochrome format. There’s also a dark version available:

You can also tint them with color (you can do this with Liquid Glass layers, too). 

You can tint the icons or infuse the color into the rounded glass container around them. 

Once you create a new app icon, it will appear on all platforms, including Mac, iPad, iPhone, and iWatch. 

Apple said it created Liquid Glass to make iOS experiences feel more organic and immersive. But is that the case?

Some early reviewers have said that Liquid Glass is ugly or that the glass metaphor is ill-suited to Apple’s core mission. In other words, why place panes of glass between users and content, making them feel distanced or disconnected from it? 

Apple has explained that Liquid Glass is a digital meta-material inspired by glass and water. It’s not meant to imitate glass surfaces explicitly, and glass does not respond in the same way as Liquid Glass. 

So instead, maybe Apple is working on taking us into the next phase of the web. With the proliferation of AI and most aspects of our lives being digitized, this new iOS UI design seems like the natural next step. 

Apple is not redesigning the totality of our online experiences, nor does it expect web designers to do so. However, it’s trying to make the devices we use daily (and for a good part of those days) feel more alive. 

It will be interesting to see how long this web design trend lasts. This feels an awful lot like the Material Design phase, where everyone got excited about the new and vibrant look of the web, only for it to fizzle out once everything started to look the same. 

If web designers can avoid this pitfall when using Liquid Glass, it could have staying power. Android will also need to switch over, which it might be doing based on its latest updates.

How do you feel about iOS 26? Will you be evolving your apps and digital experiences in the same direction? If so, the Adopting Liquid Glass guide will help, as will the classic Human Interface Guidelines (Apple’s design system updated for Liquid Glass). And check out our takes on Glassmorphism, Neubrutalism, and many other “ism” trends that have crossed web design over the years!