Agent skill

Swiftui UI Patterns

by AFK-surf in AFK-surf/OpenBridge

Best practices and example-driven guidance for building SwiftUI views and components.

MITAuto-check passedMobile

Install Swiftui UI Patterns

skills CLI
$ npx skills add AFK-surf/OpenBridge --skill swiftui-ui-patterns -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install AFK-surf/OpenBridge swiftui-ui-patterns --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/AFK-surf/OpenBridge.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/swiftui-ui-patterns .claude/skills/swiftui-ui-patterns && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
swiftui-ui-patterns
GitHub stars
430
Used in
4 other repos
Token cost
~887 tokens
SKILL.md length
352 words
Files
27 (incl. references)
Skills in repo
14
Repo updated
First seen
Licence
MIT

At a glance

Best practices and example-driven guidance for building SwiftUI views and components.

  • Works in 6 steps: Define the view's state and its… → Identify dependencies to inject via… → Sketch the view hierarchy and extract… → …
  • Refactoring SwiftUI UI
  • SKILL.md covers Quick start, General rules to follow, Workflow for a new SwiftUI view and Component references, plus 2 more sections
  • Calls rg

What it does

Swiftui UI Patterns is an agent skill from AFK-surf/OpenBridge. Best practices and example-driven guidance for building SwiftUI views and components. Use when creating or refactoring SwiftUI UI, designing tab architecture with TabView, composing screens, or needing component-specific patterns and examples.

Its SKILL.md is about 890 tokens, which your agent loads only when the skill is triggered. The skill folder holds 27 other files, including reference files (for example `references/app-wiring.md`, `references/components-index.md` and `references/controls.md`).

It sits in Mobile, covering iOS development. It works with SwiftUI. The repository describes itself as: A free, safe and open agent for everything. Alternative to Claude Cowork & Codex. Open Bridge, the AI bridge between your intention and get the job done. The licence is MIT.

When your agent uses it

  • Refactoring SwiftUI UI
  • Designing tab architecture with TabView
  • Composing screens
  • Needing component-specific patterns and examples

Example prompts

  • “/swiftui-ui-patterns”

Workflow steps

6 steps, taken from the first numbered list in SKILL.md.

  1. Define the view's state and its ownership location.
  2. Identify dependencies to inject via @Environment.
  3. Sketch the view hierarchy and extract repeated parts into subviews.
  4. Implement async loading with .task and explicit state enum if needed.
  5. Add accessibility labels or identifiers when the UI is interactive.
  6. Validate with a build and update usage callsites if needed.

What it can do on your machine

Read from SKILL.md and the folder at commit a9ca905. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • rg

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Swiftui UI Patterns loads about 887 tokens when it runs, and up to ~16k if it reads all its reference files. Until then it costs about 66 tokens; SKILL.md has 352 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~66
When it runs · the whole SKILL.md, loaded when a task matches
~887
With references · SKILL.md plus every file in references/, read only if the agent opens them
~16k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from AFK-surf/OpenBridge at commit a9ca905, republished under its MIT licence (© AFK-surf). 352 words, ~887 tokens.

Download SKILL.mdSave it as .claude/skills/swiftui-ui-patterns/SKILL.md (or your agent's skills folder). This skill also uses 26 other files; get the full folder from GitHub.
name
swiftui-ui-patterns
description
Best practices and example-driven guidance for building SwiftUI views and components. Use when creating or refactoring SwiftUI UI, designing tab architecture with TabView, composing screens, or needing component-specific patterns and examples.

SwiftUI UI Patterns

Quick start

Choose a track based on your goal:

Existing project
  • Identify the feature or screen and the primary interaction model (list, detail, editor, settings, tabbed).
  • Find a nearby example in the repo with rg "TabView\(" or similar, then read the closest SwiftUI view.
  • Apply local conventions: prefer SwiftUI-native state, keep state local when possible, and use environment injection for shared dependencies.
  • Choose the relevant component reference from references/components-index.md and follow its guidance.
  • Build the view with small, focused subviews and SwiftUI-native data flow.
New project scaffolding
  • Start with references/app-scaffolding-wiring.md to wire TabView + NavigationStack + sheets.
  • Add a minimal AppTab and RouterPath based on the provided skeletons.
  • Choose the next component reference based on the UI you need first (TabView, NavigationStack, Sheets).
  • Expand the route and sheet enums as new screens are added.

General rules to follow

  • Use modern SwiftUI state (@State, @Binding, @Observable, @Environment) and avoid unnecessary view models.
  • Prefer composition; keep views small and focused.
  • Use async/await with .task and explicit loading/error states.
  • Maintain existing legacy patterns only when editing legacy files.
  • Follow the project's formatter and style guide.
  • Sheets: Prefer .sheet(item:) over .sheet(isPresented:) when state represents a selected model. Avoid if let inside a sheet body. Sheets should own their actions and call dismiss() internally instead of forwarding onCancel/onConfirm closures.
Show full SKILL.md (137 more words)Show less

Workflow for a new SwiftUI view

  1. Define the view's state and its ownership location.
  2. Identify dependencies to inject via @Environment.
  3. Sketch the view hierarchy and extract repeated parts into subviews.
  4. Implement async loading with .task and explicit state enum if needed.
  5. Add accessibility labels or identifiers when the UI is interactive.
  6. Validate with a build and update usage callsites if needed.

Component references

Use references/components-index.md as the entry point. Each component reference should include:

  • Intent and best-fit scenarios.
  • Minimal usage pattern with local conventions.
  • Pitfalls and performance notes.
  • Paths to existing examples in the current repo.

Sheet patterns

Item-driven sheet (preferred)
swift
@State private var selectedItem: Item?

.sheet(item: $selectedItem) { item in
    EditItemSheet(item: item)
}
Sheet owns its actions
swift
struct EditItemSheet: View {
    @Environment(\.dismiss) private var dismiss
    @Environment(Store.self) private var store

    let item: Item
    @State private var isSaving = false

    var body: some View {
        VStack {
            Button(isSaving ? "Saving…" : "Save") {
                Task { await save() }
            }
        }
    }

    private func save() async {
        isSaving = true
        await store.save(item)
        dismiss()
    }
}

Adding a new component reference

  • Create references/<component>.md.
  • Keep it short and actionable; link to concrete files in the current repo.
  • Update references/components-index.md with the new entry.

© AFK-surf, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 26 other files (references) in .agents/skills/swiftui-ui-patterns of AFK-surf/OpenBridge.

  • SKILL.md
  • references/app-wiring.md
  • references/components-index.md
  • references/controls.md
  • references/deeplinks.md
  • references/focus.md
  • references/form.md
  • references/grids.md
  • references/haptics.md
  • references/input-toolbar.md
  • references/lightweight-clients.md
  • references/list.md
  • references/loading-placeholders.md
  • references/macos-settings.md
  • references/matched-transitions.md
  • references/media.md
  • references/menu-bar.md
  • references/navigationstack.md
  • references/overlay.md
  • references/scrollview.md
  • … and 7 more

Open the folder on GitHubat commit a9ca905

Used in 4 other repositories

We found 4 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 4 other GitHub owners. This page covers the copy in AFK-surf/OpenBridge, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Swiftui UI Patterns next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Swiftui UI Patterns compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Swiftui UI Patterns this skillAFK-surf/OpenBridge4304 repos~887Automated safety check: PassMIT
Swiftui Protwostraws/SwiftUI-Agent-Skill5.1k2 repos~1.5kAutomated safety check: PassMIT
Swiftui Performance Auditharperreed/dotfiles3348 repos~1.4kAutomated safety check: PassNone
Hig Project Contextraintree-technology/hig-doctor1435 repos~1.2kAutomated safety check: PassMIT
Hig Components Contentraintree-technology/hig-doctor1435 repos~1.3kAutomated safety check: PassMIT
Chunuiliseami/ChunUI525—~642Automated safety check: PassMIT

Similar skills

  • Swiftui Pro

    twostraws/SwiftUI-Agent-Skill

    Comprehensively reviews SwiftUI code for best practices on modern APIs, maintainability, and performance.

    5.1k GitHub starsUsed in 2 repos~1.5k tokens
    MobileAuto-check passed
  • Swiftui Performance Audit

    harperreed/dotfiles

    Audit and improve SwiftUI runtime performance from code review and architecture.

    334 GitHub starsUsed in 8 repos~1.4k tokens
    MobileAuto-check passed
  • Hig Project Context

    raintree-technology/hig-doctor

    Create or update a shared Apple design context document that other HIG skills use to tailor guidance.

    143 GitHub starsUsed in 5 repos~1.2k tokens
    MobileAuto-check passed
  • Hig Components Content

    raintree-technology/hig-doctor

    Apple Human Interface Guidelines for content display components.

    143 GitHub starsUsed in 5 repos~1.3k tokens
    MobileAuto-check passed
  • Chunui

    liseami/ChunUI

    Build iOS apps with the ChunUI design system (Monochrome texture extracted from the production app Zinner/Chat0IM).

    525 GitHub stars~642 tokensUpdated 14 days ago
    MobileAuto-check passed
  • Swiftui Iphone Duo

    FloWritesCode/fwc-swiftui-skills

    Adapts and reviews SwiftUI apps for iPhone Duo and continuously changing window sizes.

    368 GitHub stars~2.9k tokensUpdated 10 days ago
    MobileAuto-check passed

More from AFK-surf/OpenBridge

All 14 skills in this repo
  • Swiftui Expert Skill

    AFK-surf/OpenBridge

    Write, review, or improve SwiftUI code following best practices for state management, view composition, performance, modern APIs, Swift concurrency, and iOS 26+ Liquid Glass adoption.

    430 GitHub starsUsed in 2 repos~3.9k tokens
    Auto-check passed
  • UI Designer

    AFK-surf/OpenBridge

    Design or restyle user interfaces using vendored DESIGN.md references from popular product and brand-inspired visual systems.

    430 GitHub stars~4.6k tokensUpdated 4 mo ago
    Auto-check passed
  • Bridge Agent Log Analyzer

    AFK-surf/OpenBridge

    Analyze Bridge agent execution logs from ~/.bridge/sessions, reconstruct the agent's actual runtime behavior, and explain tool execution, failures, retries, and artifacts from persisted session files.

    430 GitHub stars~1.3k tokensUpdated 4 mo ago
    Auto-check passed
  • Format Converter

    AFK-surf/OpenBridge

    Convert files between formats. An agent skill from AFK-surf/OpenBridge.

    430 GitHub stars~549 tokensUpdated 4 mo ago
    Auto-check passed
  • Skill Manager

    AFK-surf/OpenBridge

    Manage skills: create, install, modify, or delete skills. An agent skill from AFK-surf/OpenBridge.

    430 GitHub stars~749 tokensUpdated 4 mo ago
    Auto-check passed
  • Swift Concurrency

    AFK-surf/OpenBridge

    Expert guidance on Swift Concurrency best practices, patterns, and implementation.

    430 GitHub stars~2.8k tokensUpdated 4 mo ago
    Auto-check passed

Works with

Categories

Questions about Swiftui UI Patterns

What does Swiftui UI Patterns do?

Best practices and example-driven guidance for building SwiftUI views and components. Swiftui UI Patterns is an agent skill from AFK-surf/OpenBridge. Best practices and example-driven guidance for building SwiftUI views and components.

When should I use Swiftui UI Patterns?

Swiftui UI Patterns fits situations like: refactoring SwiftUI UI; designing tab architecture with TabView; composing screens; needing component-specific patterns and examples.

How do I install Swiftui UI Patterns in Claude Code?

Run `npx skills add AFK-surf/OpenBridge --skill swiftui-ui-patterns -a claude-code`. Or copy the skill folder (.agents/skills/swiftui-ui-patterns in AFK-surf/OpenBridge) into .claude/skills/swiftui-ui-patterns in your project. Claude Code loads it when a task matches its description.

How do I install Swiftui UI Patterns in Codex?

Run `npx skills add AFK-surf/OpenBridge --skill swiftui-ui-patterns -a codex`. Or copy the skill folder (.agents/skills/swiftui-ui-patterns in AFK-surf/OpenBridge) into .agents/skills/swiftui-ui-patterns in your project. Codex loads it when a task matches its description.

Can I use Swiftui UI Patterns in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add AFK-surf/OpenBridge --skill swiftui-ui-patterns -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/swiftui-ui-patterns, .gemini/skills/swiftui-ui-patterns, .github/skills/swiftui-ui-patterns and .opencode/skills/swiftui-ui-patterns in your project.

What does Swiftui UI Patterns need to run?

Going by SKILL.md and its folder, Swiftui UI Patterns needs the command-line tools its instructions call (rg).

Does Swiftui UI Patterns access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Swiftui UI Patterns safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Swiftui UI Patterns use?

Swiftui UI Patterns is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Swiftui UI Patterns use?

About 887 tokens (SKILL.md is roughly 3.5k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 15k tokens, read only when the agent opens those files.

What are the alternatives to Swiftui UI Patterns?

Skills that share tags, products or a category with Swiftui UI Patterns: Swiftui Pro (twostraws/SwiftUI-Agent-Skill, 5.1k stars), Swiftui Performance Audit (harperreed/dotfiles, 334 stars), Hig Project Context (raintree-technology/hig-doctor, 143 stars) and Hig Components Content (raintree-technology/hig-doctor, 143 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Swiftui UI Patterns?

AFK-surf (a GitHub organization) maintains it in AFK-surf/OpenBridge, which has 430 GitHub stars. The repository holds 14 skills in this directory. The repository was last updated on June 10, 2026.

Source: AFK-surf/OpenBridge on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.