From preview-build
Builds and captures Xcode/SwiftUI previews as screenshots for visual analysis. Supports standalone Swift files, Xcode projects, and SPM packages.
How this skill is triggered — by the user, by Claude, or both
Slash command
/preview-build:previewThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
<skill-definition>
This skill allows you to build SwiftUI views and capture screenshots of their rendered output for visual analysis. It supports:
Scripts are located at ${CLAUDE_PLUGIN_ROOT}/scripts/
Auto-detects project type and uses the best approach:
"${CLAUDE_PLUGIN_ROOT}"/scripts/preview \
<path-to-file.swift> \
--output /tmp/preview.png
Capture a screenshot of whatever is currently displayed on the booted simulator.
"${CLAUDE_PLUGIN_ROOT}"/scripts/capture-simulator.sh \
--output /tmp/preview-capture.png
Fast builds by injecting a minimal PreviewHost target (handled automatically by the unified script):
"${CLAUDE_PLUGIN_ROOT}"/scripts/preview \
<path-to-file.swift> \
--project <path.xcodeproj> \
--output /tmp/preview.png
Auto-detected from Package.swift in parent directories:
"${CLAUDE_PLUGIN_ROOT}"/scripts/preview \
<path-to-file.swift> \
--output /tmp/preview.png
Build a standalone Swift file with system frameworks only:
"${CLAUDE_PLUGIN_ROOT}"/scripts/preview \
<path-to-file.swift> \
--output /tmp/preview.png
When the user invokes /preview, follow this workflow:
Identify the target: Determine what needs to be previewed:
Build and capture: Use the appropriate script based on the target
Read and analyze: Use the Read tool to view the captured PNG image
Report findings: Describe what you see in the preview, including:
The user can specify:
file: Path to a Swift file to previewproject: Path to an Xcode projectworkspace: Path to an Xcode workspacescheme: Build scheme namesimulator: Simulator to use (default: "iPhone 17 Pro")wait: Seconds to wait before capture (default: 3)User: /preview ContentView.swift
User: /preview --project MyApp.xcodeproj --scheme MyApp
User: /preview --capture-only
If the build fails:
If no simulator is booted:
After capturing, always:
npx claudepluginhub iron-ham/xcodepreviews --plugin preview-buildCaptures screenshots of SwiftUI #Preview blocks using axe CLI. Visualize View appearance, check layouts, and verify visual changes.
Converts Claude HTML/CSS prototypes (via design URL or .tar.gz) to single self-contained SwiftUI View files in active Xcode workspaces. Generates code, builds, previews, and visually diffs for layout fidelity.
Debugs iOS app issues in simulator via structured loop: captures screenshots/logs with ios-simulator/XcodeBuildMCP, analyzes problems, proposes specific fixes, confirms with user, rebuilds, and verifies changes.