Generate SwiftUI components following Apple HIG. Use when creating iOS UI components, building SwiftUI views, or need code scaffolding for iOS interfaces.
Generate production-ready SwiftUI code following Apple Human Interface Guidelines.
Color.primary, Color(.systemBackground), not hex.font(.body)// ✅ Good
struct ExpenseCard: View {
let expense: Expense
var body: some View {
HStack {
Image(systemName: expense.category.icon)
.foregroundStyle(.secondary)
.accessibilityHidden(true)
VStack(alignment: .leading) {
Text(expense.title)
.font(.headline)
Text(expense.date, style: .date)
.font(.subheadline)
.foregroundStyle(.secondary)
}
Spacer()
Text(expense.amount, format: .currency(code: "USD"))
.font(.headline)
}
.padding()
.background(Color(.secondarySystemBackground))
.clipShape(RoundedRectangle(cornerRadius: 12))
.accessibilityElement(children: .combine)
.accessibilityLabel("\(expense.title), \(expense.amount)")
}
}
// ❌ Bad
struct ExpenseCard: View {
var body: some View {
HStack {
Image("custom-icon") // Use SF Symbols
Text("$50.00")
.foregroundColor(Color(hex: "#333")) // Use semantic
}
.frame(height: 30) // Too small for touch
}
}
User: Create a settings screen with profile section and preferences
Claude: [Generates SwiftUI code]
- SettingsView with List and sections
- ProfileHeaderView component
- PreferenceRow reusable component
- All using semantic colors and SF Symbols
Generated code includes:
ios-design-review — Validate generated codeios-hig-reference — Design guidelines reference