design.md

AI-ready Markdown · Human-readable · 109 tokens

Preview

# apple.com Design System

> Inspected by UI Archive — https://ui-archive.com/apple.com
> Last updated: 2026-04-16

## Colors

| Token | Value | Description |
|-------|-------|-------------|
| --color-r-globalnav-background-opened | #fafafc | Defined in :root as --r-globalnav-background-opened |
| --color-sk-focus-color | #0071e3 | Defined in :root as --sk-focus-color |
| --color-sk-focus-color-alt | rgb(0, 0, 0) | Defined in :root as --sk-focus-color-alt |
| --color-sk-body-link-color | rgb(0, 102, 204) | Defined in :root as --sk-body-link-color |
| --color-sk-glyph-gray-alpha | rgba(0, 0, 0, 0.88) | Defined in :root as --sk-glyph-gray-alpha |
| --color-sk-glyph-gray-secondary | rgb(110, 110, 115) | Defined in :root as --sk-glyph-gray-secondary |
| --color-sk-glyph-gray-secondary-alpha | rgba(0, 0, 0, 0.56) | Defined in :root as --sk-glyph-gray-secondary-alpha |
| --color-sk-glyph-gray-secondary-alt | rgb(66, 66, 69) | Defined in :root as --sk-glyph-gray-secondary-alt |
| --color-sk-glyph-gray-secondary-alt-alpha | rgba(0, 0, 0, 0.72) | Defined in :root as --sk-glyph-gray-secondary-alt-alpha |
| --color-sk-glyph-gray-tertiary-alpha | rgba(0, 0, 0, 0.48) | Defined in :root as --sk-glyph-gray-tertiary-alpha |
| --color-sk-glyph-orange | rgb(182, 68, 0) | Defined in :root as --sk-glyph-orange |
| --color-sk-glyph-green | rgb(0, 128, 9) | Defined in :root as --sk-glyph-green |
| --color-sk-glyph-red | rgb(227, 0, 0) | Defined in :root as --sk-glyph-red |
| --color-sk-fill-gray-tertiary-alpha | rgba(0, 0, 0, 0.16) | Defined in :root as --sk-fill-gray-tertiary-alpha |
| --color-sk-fill-gray-quaternary-alpha | rgba(0, 0, 0, 0.08) | Defined in :root as --sk-fill-gray-quaternary-alpha |
| --color-sk-fill-orange | rgb(245, 99, 0) | Defined in :root as --sk-fill-orange |
| --color-sk-fill-green | rgb(3, 161, 14) | Defined in :root as --sk-fill-green |
| --color-sk-fill-green-secondary | rgb(245, 255, 246) | Defined in :root as --sk-fill-green-secondary |
| --color-sk-fill-yellow | rgb(255, 224, 69) | Defined in :root as --sk-fill-yellow |

## Typography

All Tokens

Colors

35

Typography

24

Spacing

32

Radius

14

Shadows

4

Checking your plan…

Also available: Tokens Studio JSON

W3C DTCG format, ready to import into Figma via the Tokens Studio plugin.

View JSON export →