Does this skill support both SwiftUI and UIKit?

Yes, it provides core implementation patterns, modifiers for SwiftUI, and UIGlassEffect configurations for UIKit.

What is Liquid Glass Design?

It is a dynamic material system for iOS that blurs content behind it, reflects surrounding light, and morphs during touch or pointer interactions.

Why should I use GlassEffectContainer?

Using the container pattern is a performance best practice that enables smooth morphing and blending between multiple glass elements.

Is this skill compatible with WidgetKit?

Yes, it includes specific patterns for rendering modes and accented groups to ensure widgets look native on tinted Home Screens.

Liquid Glass Design System

Name: Liquid Glass Design System
Author: nbossn

bynbossn

0•

Mobile Development

Implements dynamic iOS Liquid Glass design patterns including glass materials, interactive morphing, and blurred UI components across Apple platforms.

This skill provides comprehensive implementation patterns for Apple's Liquid Glass design language, enabling developers to build sophisticated interfaces with dynamic materials that react to light and touch. It covers essential techniques for SwiftUI, UIKit, and WidgetKit, including high-performance glass containers, smooth morphing transitions, and adaptive widget rendering modes to ensure consistent, professional-grade visual depth and interactivity in modern iOS applications.

主要功能

01Dynamic glass materials with blur and reflection effects

02Adaptive accented rendering modes for iOS Home Screen widgets

03Optimized GlassEffectContainer patterns for high-performance rendering

04Comprehensive support for SwiftUI, UIKit, and WidgetKit integration

050 GitHub stars

06Interactive morphing transitions between glass elements

使用场景

01Creating interactive, morphing buttons and floating action containers

02Implementing system-standard widget backgrounds for iOS Home Screens

03Designing modern navigation and toolbars with adaptive translucency

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add nbossn/claude-code-base liquid-glass-design

For use in Claude.ai and ChatGPT

主要功能

01Dynamic glass materials with blur and reflection effects

02Adaptive accented rendering modes for iOS Home Screen widgets

03Optimized GlassEffectContainer patterns for high-performance rendering

04Comprehensive support for SwiftUI, UIKit, and WidgetKit integration

050 GitHub stars

06Interactive morphing transitions between glass elements

使用场景

01Creating interactive, morphing buttons and floating action containers

02Implementing system-standard widget backgrounds for iOS Home Screens

03Designing modern navigation and toolbars with adaptive translucency

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add nbossn/claude-code-base liquid-glass-design

For use in Claude.ai and ChatGPT