FWC SwiftUI Skills
Two SwiftUI skills: native Liquid Glass for iOS 26 and adaptive layout for the foldable iPhone Duo with no separate app version
- 454 ★ on the repository
- Last commit
- MIT
Minimal access
Why this level
- The skills are text instructions and references with no scripts or network calls
- The agent edits SwiftUI sources in your project, so review the changes in `git diff`
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add skills/fwc-swiftui-skillsDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewMinimal accessThe tool runs nothing and makes no network calls.
- The skills are text instructions and references with no scripts or network calls
- The agent edits SwiftUI sources in your project, so review the changes in `git diff`
This is third-party code. Review the repository files before installing.
What it does
A pair of skills for agents that write and review SwiftUI interfaces. The first, swiftui-liquid-glass, sends the agent to the native iOS 26 Liquid Glass APIs and bans rebuilding the effect by hand from materials, blur and shadows. It sets rules for `.glass` and `.glassProminent` buttons, shapes through `.buttonBorderShape()`, grouping in `GlassEffectContainer`, bottom bars through `.safeAreaBar(.bottom)` and toolbar items without a glass backing. The second skill, swiftui-iphone-duo, guides adaptation for the foldable iPhone Duo (iOS 27.1 SDK). The agent first makes the interface adaptive at any window width and height: `NavigationSplitView`, `ViewThatFits`, `AnyLayout`, adaptive grids. Only then does it add Duo features: reserved regions along the fold, `ArrangementView`, vertical bars, `onHingeChange` and `CameraCaptureAccessory`. Each skill sits in its own folder under `skills/` with a `reference.md` file holding detailed rules and examples. Both skills work in two modes: they review existing code against a checklist and apply changes to new code.
Who it is for. iOS developers on SwiftUI who are moving an app to Liquid Glass or preparing it for the foldable iPhone Duo and hand the review or the edits to an agent.
Good fit when
- The app moves to iOS 26 and buttons with a homemade blur have to give way to native glass
- A bottom action bar sits in a `VStack` with `.overlay()`, and glass next to a list misbehaves
- The code branches on `UIDevice`, `UIScreen.main` or orientation, and layout has to follow the window size
- A list and detail view should move to `NavigationSplitView` with the selection preserved
- Before building with the iOS 27.1 SDK you want a review of the places where content lands on the fold
Not a fit when
- The project is UIKit or a cross-platform framework: the rules are written for SwiftUI
- You need general advice on SwiftUI architecture, state and performance: SwiftUI Expert Skill in the catalog covers that
- The app supports iOS below 26 with no fallbacks: glass works only on iOS 26 and later
- You want a separate Duo design: the skill advises against it directly
Example request
Review the settings screen with the swiftui-liquid-glass skill: find homemade blur, buttons without the native style and glass inside a listLimitations
Both skills tie the platform to SDK versions: Liquid Glass needs iOS 26 or later, and the Duo features depend on Xcode 27.1 and the iOS 27.1 SDK. For older versions the skill asks for fallback branches through `#available`.
The author calls Duo behavior untestable without a device, so the skill does not guess fold coordinates and adds no Duo-only branches. You have to check sizes and poses yourself in Device Hub.
The skills review and edit code by the rules, but they do not run the interface or take screenshots. You still have to open the result in a simulator. The last commit in the repository dates from October 2026.
How to disable. Delete the swiftui-liquid-glass and swiftui-iphone-duo folders from your agent's skills directory, for example `~/.claude/skills/` or `.agents/skills/` in the project. The agent stops picking them up in new sessions.
FAQ
Can I install only one skill from the set?
Yes. `npx skills add FloWritesCode/fwc-swiftui-skills --skill swiftui-liquid-glass` copies a single skill. By hand it is enough to move its folder from `skills/` into the agent's skills directory.
Why does the skill ban glass inside a list or ScrollView?
The skill's rule: glass elements do not go into scrolling containers, whether ScrollView, List or Form rows. Use a solid background or a material there. Glass stays for bars, buttons and pinned surfaces.
Do I need a separate interface for Duo?
No. swiftui-iphone-duo requires making the interface adaptive at any window size first and adding Duo features only when the fold or a second display brings a clear benefit.
What does a project need for Liquid Glass?
Xcode with the iOS 26 SDK or newer. For older systems the skill adds an `#available(iOS 26, *)` check and a fallback without glass.
How does swiftui-iphone-duo differ from ordinary adaptive layout?
It does not replace it. The skill walks the agent in order: adaptive layout and navigation, bars and tabs, safe areas at the fold, and only then Duo arrangements and gestures. It flags branches on `UIDevice` or `isDuo` as errors.
Discussion
No questions or reviews yet.
Related
SkillsA skill that gives the agent Apple's own SwiftUI guidance, which the installer extracts from your local Xcode
Skills for Apple development: SwiftUI, UIKit and Liquid Glass references, Swift 6 guides and a router for iOS 26+ tasks
A SwiftUI best practices skill: state, view composition, performance, new APIs, Liquid Glass and Instruments trace analysis
SwiftUI Design Skill
swiftui-design-skill
A SwiftUI interface design skill: compilable code, tokens, patterns and six rules against AI sloppiness. One-command installation through npx skills
A set of skills for iOS 26+, Swift 6.3 and SwiftUI that gives the agent knowledge of modern Apple frameworks
Skills exported from Xcode guide agents through SwiftUI reviews, test modernization and Apple platform security checks
Comparison with similar tools
Cards that share the main search query, and how they differ.
| Tool | Official | Repository stars | Main difference |
|---|---|---|---|
| FWC SwiftUI Skills (this card) | no | 454 | |
| SwiftUI Expert Skill | no | 3,830 | a general SwiftUI skill covering state, performance and APIs; this one covers only Liquid Glass and Duo |
| SwiftUI Pro | no | 6,479 | reviews SwiftUI for modern APIs and maintainability, without separate rules for glass and foldable screens |
README in short
The repository page lists the two skills in a table, shows installation through the skills CLI and by hand, and names the directories where agents keep skills: `~/.cursor/skills/`, `~/.claude/skills/`, `~/.codex/skills/` and `~/.agents/skills/`. Liquid Glass comes with a requirement for Xcode with the iOS 26 SDK. The repository layout is one folder per skill with a `SKILL.md` and an optional `reference.md`.
README badge
Original SKILL.md
--- name: swiftui-liquid-glass description: >- Implement, review, and refactor SwiftUI features using the iOS 26+ Liquid Glass API. Use when adopting Liquid Glass in new UI, converting existing surfaces to glass, reviewing glass usage for correctness, or fixing common Liquid Glass pitfalls (custom blur stacks, scroll views, button shapes, bottom bars, pre-enclosed symbols). --- # SwiftUI Liquid Glass Use native Liquid Glass APIs on iOS 26+. Do not recreate the effect with materials, blurs, or shadows. ## Core rules 1. **Don't build custom Liquid Glass** through adding backgrounds, outlines, blurs and shadows. 2. **Buttons — style**: use `.buttonStyle(.glass)` for non-colored buttons, and `.buttonStyle(.glassProminent)` for tinted buttons. `.glassProminent` supports `.tint()`, but this can only be a color (not a gradient). 3. **Buttons — shape**: use `.buttonBorderShape()` instead of applying a shape to the button label by hand. 4. **Buttons — padding**: using this button setup adds roughly 13pt of padding inside the liquid glass shape; keep this in mind when adapting designs. 5. **Custom views**: use `.glassEffect(.regular, in: ...)` to embed custom Views inside liquid glass containers. 6. **Grouped glass**: use `GlassEffectContainer` when multiple liquid glass elements are next to each other. this View / Container adds a liquid merge effect when the elements grow / touch each other. 7. **Scrolling**: avoid using liquid glass inside ScrollView and List (anything that scrolls). 8. **Bottom bars**: when anchoring a liquid glass View to the bottom of the screen, prefer embedding it in `.safeAreaBar(.bottom)` instead of a VStack or `.overlay()`.