Agent skill · software engineering · aiskillstore

liquid-glass

Implement, review, or improve SwiftUI features using the iOS 26+ Liquid Glass API. Use when asked to adopt Liquid Glass in SwiftUI UI, refactor to Liquid Glass, or review Liquid Glass usage.

Why this skill is useful

Provides specific implementation patterns and guidelines for using the Liquid Glass API in SwiftUI that the AI wouldn't reliably generate on its own.

What it needs

About 2k tokens when loaded. Last updated 2026-08-07. 405 stars on the source repository.

What this skill does

SwiftUI Liquid Glass Overview Liquid Glass is a dynamic material in iOS 26+ that combines optical glass properties with fluidity. It blurs content, reflects surrounding color and light, and reacts to touch interactions in real time. Workflow Decision Tree 1) Review an existing feature Inspect where Liquid Glass should/shouldn't be used Verify correct modifier order, shape usage, container placement Check for iOS 26+ availability handling and fallbacks 2) Improve a feature using Liquid Glass Identify target components (surfaces, chips, buttons, cards) Refactor to use GlassEffectContainer for multiple glass elements Add interactive glass only for tappable/focusable elements 3) Implement a new feature using Liquid Glass Design glass surfaces and interactions first (shape, prominence, grouping) Add glass modifiers after layout/appearance modifiers Add morphing transitions only when view hierarchy changes with animation Core Guidelines Prefer native Liquid Glass APIs over custom blurs Use GlassEffectContainer when multiple glass elements coexist Apply .glassEffect(...) after layout and visual modifiers Use .interactive() for elements that respond to touch/pointer Keep shapes consistent across related elements Gate with #available(iOS 26, ) and provide non-glass fallback Review Checklist [ ] Availability: #available(iOS 26, ) present with fallback UI [ ] Composition: Multiple glass views wrapped in GlassEffectContainer [ ] Modifier order: glassEffect applied after layout/appearance modifiers [ ] Interactivity: interactive() only where user interaction exists [ ] Transitions: glassEffectID used with @Namespace for morphing [ ] Consistency: Shapes, tinting, and spacing align across feature Implementation Checklist [ ] Define target elements and desired glass prominence [ ] Wrap grouped glass elements in GlassEffectContainer with spacing [ ] Use .glassEffect(.regular.tint(...).interactive(), in: .rect(cornerRadius: ...)) as needed [ ] Use .buttonStyle(.glass) / .buttonStyle( …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills aiskillstore/liquid-glass

View the source on GitHub

Browse the @skills marketplace