ios-color-and-materials
iOS color & materials — semantic, adaptive, never hard-coded
Source: Apple HIG Color, Dark Mode, and Materials pages (read June 2026; change logs confirm iOS-26 currency). Apple renders hex/RGB values as image swatches and explicitly says not to hard-code them — so this skill names the semantic APIs, not numbers.
1. The rule: use dynamic, semantically-named colors
"Documented color values are for your reference… The actual color values may fluctuate from release to release." Use the APIs so colors auto-adapt to light/dark + Increase Contrast + Liquid Glass.
- Don't redefine a semantic color's meaning (don't use
separatoras text, orsecondaryLabelas a background). - Always supply light + dark variants for custom colors, plus an increased-contrast option — "Even if your app ships in a single appearance mode, provide both light and dark colors to support Liquid Glass adaptivity."
2. The color APIs you actually use
System named colors (SwiftUI): red orange yellow green mint teal cyan blue indigo purple pink brown — each has default + increased-contrast variants for light/dark.
Grays: UIKit systemGray, systemGray2…6; SwiftUI gray ≈ systemGray.
Background sets — two families, each primary/secondary/tertiary (express hierarchy by nesting):
- System:
systemBackground→secondarySystemBackground→tertiarySystemBackground - Grouped (use with grouped lists/forms):
systemGroupedBackground→secondarySystemGroupedBackground→tertiarySystemGroupedBackground - Primary = overall view; Secondary = a group within it; Tertiary = a group within secondary.
Foreground / separators: label → secondaryLabel → tertiaryLabel → quaternaryLabel; placeholderText; separator (lets content show through) vs opaqueSeparator; link.