The Anatomy of a LiquidGlass Button in iOS 26

Learn about the new glass and glassProminent modifiers in iOS 26 :)

Today’s topic is a bit different. I’ve been building a FoundationModels-powered app for iOS 26, which of course means I get to adopt Liquid Glass :) However, I got a bit confused by how buttons work, so I wanted to write it out here with examples for reference.

Let’s start with a regular, non-Liquid Glass button:

The output is a non-bordered plain button:

Now the fun part - let’s make it a glass button! Simply add the .buttonStyle(.glass) to the button property:

The output is the button with a slight white background, but that is much more fun when pressed!

While the button just looks white on a white background - remember it is a glass on top of it’s background. So white on white will be more white. If we change the background color to something else, we can see the glass much better!

It’s hard to see this glass button, which is fine if this button is not that important and should stay to the side. But what if we want it to be more prominent? In that case, we can set the buttonStyle to glassProminent:

Now, the button will have a background!

But what if we want a different background than the default blue one? This is where we run into problems - hopefully this is a beta issue…

The ideal solution is that you would simply change the button tint color to your desired color:

This works, but only in DARK MODE!!

Sadly - in light mode, the red button currently just expands but stays the same color red… for now hopefully!

But there is one solution which gets slightly better results for light and dark mode (but still not the same for light mode). You can set the buttonStyle to a regular borderProminent one, and just add an interactive glassEffect:

It works better in dark mode, but is still a bit buggy:

Making a Circular Button

Now, what if you want to make your button a perfect circle? We would want the following code to work:

Unfortunately, it does not. The glassEffect doesn’t fit the shape…

I know what you’re thinking - we can add a shape to the glassEffect…

While this works initially, the weird shape issue returns when the user clicks on the button:

The solution.. for now… is to clip the shape of the button into a circle:

Finally - it works… Note that I removed the tint to show the effect more prominently:

Hopefully this will get fixed in future betas and “just work” :)