apple-ui-skillslisted

# Apple UI Skills Opinionated constraints for building Apple-style interfaces with AI agents. ## When to Apply Reference these guidelines when: - Building light-mode interfaces - Creating Apple-inspired design systems - Implementing UIs with Inter font and 4px grid ## Colors - SHOULD use light backgrounds for primary surfaces - MUST use `#FFFFFF` as page background (`surface-base`) - MUST use `#155BD0` for primary actions and focus states (`accent`) - SHOULD limit color palette to 10 distinct colors - MUST maintain text contrast ratio of at least 4.5:1 for accessibility ### Semantic Tokens | Token | HEX | RGB | Usage | |-------|-----|-----|-------| | `surface-base` | #FFFFFF | rgb(255,255,255) | Page background | | `surface-raised` | #0858DC | rgb(8,88,220) | Cards, modals, raised surfaces | | `text-primary` | #808080 | rgb(128,128,128) | Headings, body text | | `text-secondary` | #6D89B5 | rgb(109,137,181) | Secondary, muted text | | `text-tertiary` | #90C5F1 | rgb(144,197,241) | Additional text | | `border-default` | #B5C7D8 | rgb(181,199,216) | Subtle borders, dividers | | `accent` | #155BD0 | rgb(21,91,208) | Primary actions, links, focus | ## Typography - MUST use `Inter` as primary font family - SHOULD use single font family for consistency - MUST use `51px` / `700` for primary headings - MUST use `27px` / `500` for body text - SHOULD reduce font weights (currently 4 detected) - MUST use `text-balance` for headings and `text-pretty` for body text - SHOULD use `