Reference — Comprehensive Apple Human Interface Guidelines covering colors (semantic, custom, patterns), backgrounds (material hierarchy, dynamic), typography (built-in styles, custom fonts, Dynamic Type), SF Symbols (rendering modes, color, axiom-localization), Dark Mode, accessibility, and platform-specific considerations
View on GitHubSelect agents to install to:
npx add-skill https://github.com/CharlesWiltgen/Axiom/blob/main/.claude-plugin/plugins/axiom/skills/axiom-hig-ref/SKILL.md -a claude-code --skill axiom-hig-refInstallation paths:
.claude/skills/axiom-hig-ref/# Apple Human Interface Guidelines — Comprehensive Reference ## Overview The Human Interface Guidelines (HIG) define Apple's design philosophy and provide concrete guidance for creating intuitive, accessible, platform-appropriate experiences across all Apple devices. ### Three Core Principles Every design decision should support these principles: **1. Clarity** Content is paramount. Interface elements should defer to content, not compete with it. Every element has a purpose, unnecessary complexity is eliminated, and users should immediately know what they can do without extensive instructions. **2. Consistency** Apps use standard UI elements and familiar patterns. Navigation follows platform conventions, gestures work as expected, and components appear in expected locations. This familiarity reduces cognitive load. **3. Deference** The UI should not distract from essential content. Use subtle backgrounds, receding navigation when not needed, restrained branding, and let content be the hero. **From Apple HIG:** "Deference makes an app beautiful by ensuring the content stands out while the surrounding visual elements do not compete with it." ### Design System Philosophy From WWDC25: "A systematic approach means designing with intention at every level, ensuring that all elements, from the tiniest control to the largest surface, are considered in relation to the whole." #### Related Skills - Use `axiom-hig` for quick decisions and checklists - Use `axiom-liquid-glass` for iOS 26 material implementation - Use `axiom-liquid-glass-ref` for iOS 26 app-wide adoption - Use `axiom-accessibility-diag` for accessibility troubleshooting --- ## Color System ### Semantic Colors Explained Instead of hardcoded color values, use **semantic colors** that describe the *purpose* of a color rather than its appearance. Semantic colors automatically adapt to light/dark mode and accessibility settings. **Key insight from WWDC19:** "Think of Dark Mode as having the lights dimm