skilld
All skills
github avatar

/macos-golden-gate-design

@b03d933 official
by githubgithub/awesome-copilot40k stars
5,040

Design, implement, review, or refactor native macOS 27 Golden Gate interfaces in SwiftUI or AppKit. Use when a Mac app must match Apple's current macOS 27 UI kit and restrained Liquid Glass language: integrated windows, full-height sidebars, native toolbars, flat lists, tables, and forms, clear pane boundaries, accessible materials, and removal of unnecessary nested cards, framed panels, or glassmorphism. Also use for Figma macOS 27 design-to-code work and audits of interfaces that feel too boxed.

Ask your Agent

Use this Skill: https://skilld.dev/gh/github/awesome-copilot/macos-golden-gate-design

This session only. Nothing lands on disk.

referencessources.md

≈2.6k tokens on demand. Your agent reads this file only when SKILL.md points to it.

Sources and inspection routes

Source snapshot used to build this skill: 2026-09-13.

macOS 27 documentation, SDK symbols, and Figma kits can change. Refresh live sources before making release-critical or beta-sensitive claims.

Authority rules

  • Use Apple product pages, Apple Developer Documentation, the Human Interface Guidelines, Apple release notes, and Apple WWDC sessions as primary sources.
  • Use Apple's official Figma community listing to establish kit provenance.
  • A duplicated Figma design file is a working copy, not independent proof of provenance.
  • Use third-party articles only to discover primary sources or understand reactions.
  • If Apple sources disagree with the kit, prefer current documented platform behavior and note the discrepancy.
  • Do not quote Figma values as code constants unless the product explicitly requires a fixed custom design token.

Apple macOS 27 and release sources

Liquid Glass guidance

Human Interface Guidelines

SwiftUI and AppKit implementation sources

WWDC sessions

The WWDC26 AppKit and State of the Union sessions are especially important for macOS 27 refinements: edge-reaching sidebars, content under sidebars, harder scroll-edge separation for free-floating titles, updated toolbar glass, tighter window geometry, interactive glass, user tint control, and accessibility adaptation.

Official Figma kit

  • Official community listing: https://www.figma.com/community/file/1651309434229735362/macos-27
  • Creator shown by the listing: Apple
  • Listing description: Apple's official macOS 27 UI kit
  • Listing update observed: July 24, 2026
  • Coverage stated by the listing: components, text styles, color styles, materials, sidebars, toolbars, tables, buttons, menus, pointers, dark mode, window states, windows, alerts, popovers, sheets, dialogs, desktop templates, system colors, vibrancy, and SF Symbols.
  • Install the latest SF Symbols version before using the library.
  • Follow the Apple Design Resources license linked or described by the official listing.

Current working-copy nodes

Working-copy file key: BgkMzbnUpf3DwLMkAbQVCL

Figma plugin workflow

Use the Figma plugin for precise node evidence when available:

  1. Parse the file key and node ID from the URL.
  2. Use metadata only for broad discovery or a page map.
  3. Request design context for the smallest relevant node.
  4. Request a screenshot for visual truth.
  5. Request variable definitions when implementation needs tokens or styles.
  6. For large nodes, fetch children individually instead of treating a broad page response as complete.
  7. Record which node was inspected.

Use figma:figma-design-to-code for implementation extraction and figma:figma-swiftui for SwiftUI mapping. If a Figma quota blocks additional reads, use Ego on the authenticated file and document the limitation.

Ego workflow

When the Figma file is already open in Ego:

  1. Invoke $ego-browser.
  2. Call listTaskSpaces().
  3. Claim the user-owned Space with claimTaskSpace(spaceId), or resume an agent-owned Space with takeOverTaskSpace(spaceId).
  4. Verify the current URL, file key, and node ID before inspecting.
  5. Use semantic snapshots for Figma chrome and screenshots for the canvas.
  6. Select exact layers or navigate directly to exact node URLs.
  7. Leave the requested overview or handoff page open unless the user asks to close it.

Do not say a normal browser tab was inspected through Ego's agent API when no TaskSpace was claimed or created.

Firecrawl refresh workflow

Use $firecrawl-search for focused current discovery and $firecrawl-deep-research when the user requests exhaustive coverage.

Suggested queries:

  • site:developer.apple.com macOS 27 Liquid Glass sidebar toolbar window
  • site:developer.apple.com/documentation/swiftui macOS 27 glassEffect toolbar NavigationSplitView
  • site:developer.apple.com/design/human-interface-guidelines macOS sidebar toolbar windows materials
  • site:developer.apple.com/videos/play/wwdc2026 macOS 27 Liquid Glass
  • site:developer.apple.com macOS 27 release notes AppKit SwiftUI design

Search first, then fetch the exact primary pages. For an exhaustive refresh, use more than ten distinct searches, read at least 25 distinct relevant sources, record URLs and dates, and separate direct source statements from synthesis.

Source: SKILL.md on GitHub

Third-party checks

1 warning10d3 checks · Risk SAFE
  • Gen Agent Trust Hub10d

    The skill provides a framework for designing native macOS interfaces using SwiftUI and AppKit. It includes workflows for inspecting Figma designs and researching Apple documentation. The skill features explicit instructions for the AI to ignore any malicious instructions found in external source materials, effectively mitigating indirect prompt injection risks.

  • Socket10d

    No alerts

  • Snyk10d

    Risk: MEDIUM · 1 issue

Provenance

Signed by skilld at b03d933. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub yesterday.

Activeupdated 2 weeks ago

README badge

README badge for github/awesome-copilot/macos-golden-gate-design