> ios-design-system
Enforce design token usage in SwiftUI apps using iOS Human Interface Guidelines. Use when implementing design tokens, colors, or typography in SwiftUI. (triggers: **/*View.swift, **/Theme/**, **/DesignSystem/**, Color, Font, SwiftUI, ViewModifier, Theme)
curl "https://skillshub.wtf/HoangNguyen0403/agent-skills-standard/ios-design-system?format=md"iOS Design System (SwiftUI)
Priority: P2 (OPTIONAL)
Enforce design token usage in SwiftUI. Follow Apple HIG for iOS-native feel.
Token Structure
// Theme/Colors.swift
extension Color {
static let appPrimary = Color("Primary") // Asset Catalog
static let appSecondary = Color("Secondary")
static let appBackground = Color("Background")
}
// Theme/Spacing.swift
enum Spacing {
static let xs: CGFloat = 4
static let sm: CGFloat = 8
static let md: CGFloat = 16
static let lg: CGFloat = 24
}
// Theme/Typography.swift
extension Font {
static let appTitle = Font.system(size: 28, weight: .bold)
static let appBody = Font.system(size: 16, weight: .regular)
}
Usage
// ❌ FORBIDDEN
Text("Hello").foregroundColor(Color(hex: "2196F3"))
VStack(spacing: 16) { }
// ✅ ENFORCED
Text("Hello").foregroundColor(.appPrimary)
VStack(spacing: Spacing.md) { }
Text("Title").font(.appTitle)
Anti-Patterns
- No Hex Colors: Use
Color(hex: "...")→ Error. Define in asset catalog. - No Magic Spacing: Use
spacing: 16→ Error. UseSpacing.md. - No System Colors for Brand: Use
Color.bluefor brand → Error. Use.appPrimary.
Related Topics
mobile-ux-core | ios/swiftui
> related_skills --same-repo
> typescript-tooling
Development tools, linting, and build config for TypeScript. Use when configuring ESLint, Prettier, Jest, Vitest, tsconfig, or any TS build tooling. (triggers: tsconfig.json, .eslintrc.*, jest.config.*, package.json, eslint, prettier, jest, vitest, build, compile, lint)
> typescript-security
Secure coding practices for TypeScript. Use when validating input, handling auth tokens, sanitizing data, or managing secrets and sensitive configuration. (triggers: **/*.ts, **/*.tsx, validate, sanitize, xss, injection, auth, password, secret, token)
> typescript-language
Modern TypeScript standards for type safety and maintainability. Use when working with types, interfaces, generics, enums, unions, or tsconfig settings. (triggers: **/*.ts, **/*.tsx, tsconfig.json, type, interface, generic, enum, union, intersection, readonly, const, namespace)
> typescript-best-practices
Idiomatic TypeScript patterns for clean, maintainable code. Use when writing or refactoring TypeScript classes, functions, modules, or async logic. (triggers: **/*.ts, **/*.tsx, class, function, module, import, export, async, promise)