ios-sf-symbols-and-icons

Installation
SKILL.md

SF Symbols & app icons — iOS 26

Source: Apple HIG SF Symbols + App icons pages (read June 2026; App-icons change log June 8 2026).

1. SF Symbols — the system icon library

Thousands of symbols that align automatically with San Francisco text at every weight/size. Availability is version-gated — a symbol added in a given year isn't on earlier OSes; check before using newer symbols.

  • Don't use SF Symbols (or look-alikes) in app icons, logos, or trademarked use.

Weights (9): Ultralight → Black, each matching an SF font weight — match a symbol's weight to adjacent text. (Per typography rules, avoid the thin end.)

Scales (3), relative to cap height: Small, Medium (default), Large — SwiftUI .imageScale(.small/.medium/.large).

Rendering modes (4):

  • Monochrome — one color to all layers.
  • Hierarchical — one color, varying opacity per layer (depth).
  • Palette — two+ explicit colors, one per layer.
  • Multicolor — intrinsic meaningful colors (leaf green, trash.slash red).
  • .automatic picks the symbol's preferred mode — but verify legibility. Prefer system colors so symbols keep adapting to dark mode / vibrancy / accessibility.

Variants: outline (most common); fill = more emphasis — iOS tab bars + swipe actions prefer fill, toolbars take outline; slash; enclosed (circle/square — better at small sizes). Script-specific variants adapt to device language automatically.

Installs
1
GitHub Stars
1
First Seen
2 days ago
ios-sf-symbols-and-icons — jpoindexter/design-and-ai-skills