What this actually is
Apple's website does not look expensive because of taste. It looks that way because it obeys a small set of numbers, and it obeys them everywhere. Section gaps are always in the same range. The content column never gets wider than a fixed value. Body text is one specific near black, not a soft grey. Headings sit at one weight.
Once those numbers are written down, they stop being taste and start being a spec. A spec is something you can hand to Claude. That is all a skill is: a markdown file of rules that Claude loads and then follows without being reminded.
- The tokens below are quoted from an open source Apple style skill, MIT licensed, at github.com/chaos-xxl/apple-design-skill
- There are several of these. That one is the closest to a web design system rather than an iOS one, which is what you want if you are working on a website
- Nothing here is published by Apple, and none of it is official. It is a documented reading of a public design language
The numbers
Copy this block into your skill file. Everything downstream references these instead of hard coded values.
- Section gap between major page blocks: 100px, valid range 80 to 120
- Content column max width: 980px, or 1200px for wide layouts
- Card and container internal padding: 32px, valid range 24 to 40
- Component level gaps inside a section: 16px small, 32px medium, 48px large
- Text primary: #1D1D1F, which is the one most sites get wrong by using a mid grey
- Text secondary: #6E6E73, tertiary: #86868B
- Backgrounds: #FFFFFF, #F5F5F7 for alternating sections, #FBFBFD elevated, #1D1D1F for dark blocks
- Link and call to action blue: #0066CC, hover #0077ED, used sparingly and for links only
- Heading weight: 600 semibold as the default, 700 for hero headlines
- Type stack: SF Pro Display for headings, SF Pro Text for body, falling back to Helvetica Neue, then Inter from Google Fonts
Free, for your email
Get the full setup steps + the copy-paste setup prompt
The rest of this guide (4 more sections) opens right here. The setup prompt, one paste into Claude that sets it all up, comes by email only. Use your real address.
Unlocks: Making it a skill · The audit prompt, which is the part most people miss · What to expect, honestly · If you only do one thing
50,000+ follow where these guides come from. No spam, reply “unsubscribe” any time.