# Swiftui Liquid Glass

Implement, review, or improve SwiftUI Liquid Glass effects for iOS 26+.

- Repository: https://github.com/dpearson2699/swift-ios-skills (1266 stars)
- Category: Design
- License: see repository
- Last updated: 2026-07-31
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add dpearson2699/swift-ios-skills --skill swiftui-liquid-glass -g -a claude-code -y`
Codex: `npx skills add dpearson2699/swift-ios-skills --skill swiftui-liquid-glass -g -a codex -y`
Cursor: `npx skills add dpearson2699/swift-ios-skills --skill swiftui-liquid-glass -g -a cursor -y`
Gemini CLI: `npx skills add dpearson2699/swift-ios-skills --skill swiftui-liquid-glass -g -a gemini-cli -y`
Claude Code plugin marketplace: `/plugin marketplace add dpearson2699/swift-ios-skills`

## Description

Implement, review, or improve SwiftUI Liquid Glass effects for iOS 26+. Covers glassEffect modifier, GlassEffectContainer, glass button styles, glass toolbar/tab bar, static status badges vs interactive controls, morphing transitions, tinting, interactive glass, ToolbarSpacer, scrollEdgeEffectStyle, backgroundExtensionEffect, and availability gating. Use when asked about Liquid Glass, glass buttons, glassEffect, GlassEffectTransition, glassEffectID, glassEffectUnion, scroll edge effects, or adopting iOS 26 design.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# SwiftUI Liquid Glass

Liquid Glass is the dynamic translucent material introduced across Apple platforms
26. Standard SwiftUI bars and presentations adopt it automatically when built with
the current SDK. Reserve custom glass for functional controls and navigation surfaces,
not general content backgrounds.

See [references/liquid-glass.md](references/liquid-glass.md) for the full API reference with additional examples.

## Contents

- [Workflow](#workflow)
- [Core API Summary](#core-api-summary)
- [Code Examples](#code-examples)
- [Common Mistakes](#common-mistakes)
- [Review Checklist](#review-checklist)
- [References](#references)

## Workflow

Choose the path that matches the request:

### 1. Implement a new feature with Liquid Glass

1. Identify target surfaces (floating controls, custom bars, transient controls).
2. Decide shape, prominence, and whether each element is a real control or static status.
3. Wrap grouped glass elements in a `GlassEffectContainer`.
4. Apply `.glassEffect()` **after** layout and appearance modifiers.
5. Add `.interactive()` only to tappable/focusable elements.
6. Add morphing transitions with `glassEffectID(_:in:)` where the view hierarchy
   changes with animation. Put `glassEffectTransition(_:)` on the inserted or
   removed glass child, not on the always-present container, and choose the style
   using [Morphing & Transitions](#morphing--transitions).
7. Gate with `if #available(iOS 26, *)` and provide a fallback for earlier versions.

### 2. Improve an existing feature with Liquid Glass

The rest: https://github.com/dpearson2699/swift-ios-skills/blob/HEAD/skills/swiftui-liquid-glass/SKILL.md