# How to Apply Liquid Glass to Your App

[Tom Naute](https://www.strv.com/blog/authors/tom-naute) Designer

---

TL;DR After attending an Apple developer event in Amsterdam dedicated entirely to Liquid Glass, here’s what actually matters: the philosophy behind the look (the 3 C’s: content-first, concentric, cohesive); the new essential building blocks (tab bar, toolbars, edge effects, standard controls); and a practical adoption path. You get about 80% of the look for free by updating your SDK, then fine-tune and go custom for the rest. Plus, the anti-patterns to avoid, Apple’s new Icon Composer tool and what Apple actually said about accessibility and creative freedom.

Last month, I attended an Apple developer event in Amsterdam focused on a single topic: how to apply Liquid Glass to your app. I’ll share with you the things I learned, including insights you won’t typically find on the internet.

Anyone can get into an Apple developer event if they have an Apple developer account and an app on the App Store. I heard about this event through a colleague, and we decided I’d try to sign up. To be honest, we had no idea what the agenda of the event was going to be because there was no further information about it or whether I’d even be accepted. How Apple selects people for their events is a mystery to everyone, but in the end I got the confirmation about two weeks beforehand. The event actually surprised me, and I was fully sold on Liquid Glass.

Walking into the venue, the first thing I noticed was the super friendly and genuine people asking me how I was doing and whether I had already implemented Liquid Glass in our app. It was the kind of environment where you could tell the hosts had thought carefully about how people should feel.

The session was hosted by several Apple “Evangelists.” For one afternoon, the agenda was tight: a welcome, the main talk on designing with Liquid Glass, Q&A, a break, a developer spotlight featuring three speakers presenting three products, a panel discussion and some time for networking with the European scene and a few Apple designers and developers.

I’ll share with you the things I think might inspire you too. Let’s get into what I learned.

## It’s Not Just About Liquid Glass

Liquid Glass represents a new way of thinking about how interfaces should look within Apple’s ecosystem. The goal is to unify the structural parts of the digital environment, such as navigation and interaction patterns, so deeply that any app, regardless of its visual identity, feels like a natural part of iOS. It does this without erasing creativity or making every app look identical. The whole magic of Liquid Glass lies in the interactivity of the UI, which shines when the user engages with Apple’s interface. Yes, Liquid Glass is highly characteristic in a digital environment, but part of that character is how beautifully it complements whatever creative design lives underneath it.

## The 3 C’s

At first glance, it might seem that Liquid Glass is simply just Liquid Glass, but there is a much deeper idea behind it. It comes down to three core principles that accompany Liquid Glass, and they are called the 3 C’s: content-first, concentric, cohesive.

### Content-first

Glass is never the point. It exists to frame and elevate the content behind it. If the glass effect draws more attention than the content it surrounds, it’s being misused. Every design decision should start with the question, “Does this serve the content?”

### Concentric

The shapes, radiuses and proportions of UI elements should echo each other and the device itself. The rounded corners of the display, the icons, the sheets and the buttons all share the same visual DNA. Nothing should feel like it came from a different design system.

### Cohesive

A single glass component in an otherwise flat app creates dissonance. The goal is a UI where every element feels like it belongs to the same family. When adopted consistently, Liquid Glass makes the app feel like a natural extension of iOS itself.

## What are the Essential Liquid Glass Components?

The new direction has several essential building blocks: a bold tab bar, redesigned toolbars, edge effects and some updated basic components. Let’s break them down one by one.

### Tab Bar

In iOS 26, the tab bar automatically receives the Liquid Glass treatment without any extra work from engineers. It becomes a floating, translucent surface that blurs the content scrolling behind it. The active tab is indicated by a glass capsule highlight. This alone is one of the most visible changes in the new design language.

Remember that if a color is used in the tab bar, for example, for the active state, you need to prepare several color variants for it: light and dark modes and also when the user has increased contrast enabled.

### Toolbars

Toolbars at the top and bottom of the screen gain the same glass backing. Icons and controls inside them appear to float above the content rather than sitting on a flat bar. This reinforces the sense of depth and layering that defines iOS 26.

### Edge Effects

A new set of visual effects that appear at the boundaries between glass surfaces and the screen edges. These subtle specular highlights and shadows help communicate the physical metaphor of glass: there is a real, light-refracting material present on screen.

### Soft Light vs. Hard Light

### Updated Standard Controls

Toggles, sliders, segmented controls, steppers and buttons have all been updated to match the new aesthetic. They use the same translucency and blur logic, so they feel native inside any glass-backed surface.

## The 80/20 Rule

The presenter emphasized that simply updating to the latest SDK and using system components is enough to get 80% of the Liquid Glass look without writing a single line of custom code. The remaining 20% is where intentional fine-tuning and custom work live.

## Fine-tune

Let's see how we can fine-tune.

### Search Tab

Instead of placing a search bar inside the content area or a navigation bar, iOS 26 introduces a dedicated search tab in the tab bar. It behaves like any other tab but opens directly into a search experience. This keeps the main content area clean and makes search a first-class destination.

### Minimize Tab Bar

When the user scrolls down into content, the tab bar can be configured to minimize, collapsing into a small floating pill that stays accessible without occupying the full bottom strip. It expands again when the user scrolls back up or taps.

### Bottom Accessory

A persistent UI element that sits between the content and the tab bar. The classic example is a mini audio player that stays visible across all tabs. It is distinct from a toolbar in that it represents ongoing states rather than contextual actions. It receives automatic glass styling and integrates smoothly with the tab bar below it.

### Toolbar Menu

A new pattern where tapping a toolbar button reveals an inline contextual menu that drops down from the toolbar itself, rendered in glass. It avoids the visual interruption of a full-screen action sheet and keeps the user anchored in context. Useful for options that are important but not frequent enough to warrant a permanent button.

### Glass Sheet

Modal sheets in iOS 26 are no longer opaque white cards. They are rendered as glass surfaces that blur and tint whatever is behind them. The depth of the blur and the degree of translucency can be configured. This makes sheets feel lighter and less disruptive. The user retains visual context of where they came from.

### Tinted Glass

Allows the glass effect to absorb a hint of the app’s accent color. Instead of a neutral gray-white blur, the surface takes on a subtle wash of color. Used well, this makes the glass feel like it belongs to the app’s identity rather than being a generic iOS surface. Used poorly, it can reduce legibility, so restraint is advised.

## Go Custom

### Regular Glass

The standard glass mode. It applies a background blur at medium intensity with a subtle light tint. This is the closest equivalent to what iOS has used in sheets and sidebars for several years, but it is now formally exposed as a reusable component. Appropriate for most UI surfaces that need to float above content.

### Clear Glass

A fully transparent surface that applies no tonal overlay of its own. It still interacts with light and renders the specular edge highlight, but the surface color comes entirely from whatever is behind it. This is the right choice when the background content is rich and colorful, and you want the glass to be nearly invisible as a material.

## Add Polish

### Zoom Transition

A new navigation transition where the destination view appears to grow out of the element that was tapped: an icon, a card, a row. The animation preserves spatial context so the user always knows where the new screen came from and how to get back. It replaces the standard horizontal push in many contexts and feels more physical and grounded.

### Corner Configuration

The radius of a glass element’s corners should not be arbitrary. Apple’s guidance is that corner radii should be derived from the context: matching the device’s display corners when a sheet extends to the edge or nested according to a concentric logic when a glass element sits inside another rounded container. Getting this right is one of the details that separates polished apps from ones that feel slightly off.

### Background Extension

Content behind a glass bar should be allowed to scroll or render underneath it, not stop at the edge of the bar. This extension, where a photo, a map or a gradient bleeds behind the navigation bar or tab bar is what makes the glass effect believable. Without it, the glass surface has nothing interesting to render and falls flat.

### Glass Effect Container

For cases where none of the standard components fit, Apple exposes a full glass effect container that engineers can use as a building block for entirely custom UI. It renders with the correct blur, tint, specular highlight and shadow. The presenter showed examples of bespoke game HUDs, custom pickers and branded overlays built on this primitive.

## Don’ts: Anti-Patterns to Avoid

### Glass-On-Glass

Placing a glass element directly on top of another glass surface causes the blur to compound. The result is visual noise rather than depth: the background behind both layers becomes an unreadable smear. If your background is already a glass surface, the foreground element should use a different material or a solid tint to create contrast.

### Colored Navigation Bars

Applying a custom background color to a navigation bar overrides the glass rendering entirely. The bar reverts to a flat, opaque surface that no longer participates in the depth system. This was already discouraged in previous iOS versions but becomes a more visible problem in iOS 26, where the contrast between glass and non-glass surfaces is stark.

### Ghost Glass

Glass only works when there is rich, varied content behind it. On a plain white or monochromatic background, the blur has nothing to render, and the glass becomes invisible: a transparent surface indistinguishable from nothing. Always make sure that glass elements are positioned above content that has color, texture or motion behind them.

## Icon Composer: A New Tool for Creating App Icons

Apple released Icon Composer as a dedicated Mac application for building iOS 26-compatible app icons. It replaces the previous workflow of flattening a design into a single PNG. Icons are now built as layered documents with each layer having independent material properties.

### Layer Controls

Each layer in Icon Composer can be configured independently for specular highlight intensity, translucency, blur amount and shadow depth. This allows icons to respond to light in a way that feels consistent with the Liquid Glass surfaces inside the app. An icon with a glass foreground element will catch light at the same angle as the glass bars in the UI.

### Adaptive Rendering

Icons built in Icon Composer automatically produce correct variants for light mode, dark mode and the new tinted color scheme introduced in iOS 18 and expanded in iOS 26. The designer defines the layers and materials once, and the system handles the rest. This removes the previous manual work of producing three separate icon assets.

## Q&A

To close the session, there was a Q&A where we could ask anything. Naturally, the first two questions were about accessibility, followed by my questions. Here are the most interesting questions and answers from that discussion:

### Accessibility Issues

**Q:** Liquid Glass has faced criticism for accessibility issues: translucent elements, low contrast by default and UI that can disappear against certain backgrounds. How should we think about this, and how is Apple addressing it?

**A:** Apple is open to the conversation, and they did adjust contrast values between betas and new versions. But there is a more general issue: accessibility still isn’t a unified system. It doesn’t account for ambient lighting, screen brightness, visual hierarchy or the fact that users build muscle memory around navigation patterns. The risk is that “accessible” gets reduced to a contrast ratio checkbox when the real experience is far more nuanced than that.

### Creativity vs. Liquid Glass

**Q:** Previous versions of iOS allowed a degree of visual freedom while still maintaining compatibility with the general “iOS look.” Liquid Glass has a stronger personality and can clash more easily with third-party design systems. Should third-party engineers be required to adopt Liquid Glass in every app to comply with the Human Interface Guidelines?

**A:** Apple does give engineers freedom, but they would love to see us embrace Liquid Glass and especially use it in creative, expressive ways rather than just applying it literally. On top of that, Apple is promoting apps that adopt it in the App Store.

---

Don't miss anything