{
  "$schema": "https://tr.designtokens.org/format/",
  "$description": "Design tokens for Apple",
  "meta": {
    "name": "Apple",
    "description": "A photography-first interface that turns marketing into a museum gallery. Edge-to-edge product tiles alternate light and dark canvases, framed by SF Pro Display headlines with negative letter-spacing and a single Action Blue (#0066cc) interactive color. UI chrome recedes so the product can speak — no decorative gradients, no shadows on chrome, only the one signature drop-shadow under product imagery resting on a surface.",
    "theme": "light"
  },
  "color": {
    "primary": {
      "$value": "#0066cc",
      "$type": "color",
      "$description": "Use for the primary role."
    },
    "primary-focus": {
      "$value": "#0071e3",
      "$type": "color",
      "$description": "Use for the primary focus role."
    },
    "primary-on-dark": {
      "$value": "#2997ff",
      "$type": "color",
      "$description": "Use for the primary on dark role."
    },
    "ink": {
      "$value": "#1d1d1f",
      "$type": "color",
      "$description": "Use for the ink role."
    },
    "body": {
      "$value": "#1d1d1f",
      "$type": "color",
      "$description": "Use for the body role."
    },
    "body-on-dark": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the body on dark role."
    },
    "body-muted": {
      "$value": "#cccccc",
      "$type": "color",
      "$description": "Use for the body muted role."
    },
    "ink-muted-80": {
      "$value": "#333333",
      "$type": "color",
      "$description": "Use for the ink muted 80 role."
    },
    "ink-muted-48": {
      "$value": "#7a7a7a",
      "$type": "color",
      "$description": "Use for the ink muted 48 role."
    },
    "divider-soft": {
      "$value": "#f0f0f0",
      "$type": "color",
      "$description": "Use for the divider soft role."
    },
    "hairline": {
      "$value": "#e0e0e0",
      "$type": "color",
      "$description": "Use for the hairline role."
    },
    "canvas": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the canvas role."
    },
    "canvas-parchment": {
      "$value": "#f5f5f7",
      "$type": "color",
      "$description": "Use for the canvas parchment role."
    },
    "surface-pearl": {
      "$value": "#fafafc",
      "$type": "color",
      "$description": "Use for the surface pearl role."
    },
    "surface-tile-1": {
      "$value": "#272729",
      "$type": "color",
      "$description": "Use for the surface tile 1 role."
    },
    "surface-tile-2": {
      "$value": "#2a2a2c",
      "$type": "color",
      "$description": "Use for the surface tile 2 role."
    },
    "surface-tile-3": {
      "$value": "#252527",
      "$type": "color",
      "$description": "Use for the surface tile 3 role."
    },
    "surface-black": {
      "$value": "#000000",
      "$type": "color",
      "$description": "Use for the surface black role."
    },
    "surface-chip-translucent": {
      "$value": "#d2d2d7",
      "$type": "color",
      "$description": "Use for the surface chip translucent role."
    },
    "on-primary": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the on primary role."
    },
    "on-dark": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the on dark role."
    }
  },
  "typography": {
    "hero-display": {
      "$value": {
        "fontFamily": "SF Pro Display, system-ui, -apple-system, sans-serif",
        "fontSize": "56px",
        "fontWeight": 600,
        "lineHeight": 1.07,
        "letterSpacing": "-0.28px"
      },
      "$type": "typography",
      "$description": "Typography style for hero display."
    },
    "display-lg": {
      "$value": {
        "fontFamily": "SF Pro Display, system-ui, -apple-system, sans-serif",
        "fontSize": "40px",
        "fontWeight": 600,
        "lineHeight": 1.1,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for display lg."
    },
    "display-md": {
      "$value": {
        "fontFamily": "SF Pro Text, system-ui, -apple-system, sans-serif",
        "fontSize": "34px",
        "fontWeight": 600,
        "lineHeight": 1.47,
        "letterSpacing": "-0.374px"
      },
      "$type": "typography",
      "$description": "Typography style for display md."
    },
    "lead": {
      "$value": {
        "fontFamily": "SF Pro Display, system-ui, -apple-system, sans-serif",
        "fontSize": "28px",
        "fontWeight": 400,
        "lineHeight": 1.14,
        "letterSpacing": "0.196px"
      },
      "$type": "typography",
      "$description": "Typography style for lead."
    },
    "lead-airy": {
      "$value": {
        "fontFamily": "SF Pro Text, system-ui, -apple-system, sans-serif",
        "fontSize": "24px",
        "fontWeight": 300,
        "lineHeight": 1.5,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for lead airy."
    },
    "tagline": {
      "$value": {
        "fontFamily": "SF Pro Display, system-ui, -apple-system, sans-serif",
        "fontSize": "21px",
        "fontWeight": 600,
        "lineHeight": 1.19,
        "letterSpacing": "0.231px"
      },
      "$type": "typography",
      "$description": "Typography style for tagline."
    },
    "body-strong": {
      "$value": {
        "fontFamily": "SF Pro Text, system-ui, -apple-system, sans-serif",
        "fontSize": "17px",
        "fontWeight": 600,
        "lineHeight": 1.24,
        "letterSpacing": "-0.374px"
      },
      "$type": "typography",
      "$description": "Typography style for body strong."
    },
    "body": {
      "$value": {
        "fontFamily": "SF Pro Text, system-ui, -apple-system, sans-serif",
        "fontSize": "17px",
        "fontWeight": 400,
        "lineHeight": 1.47,
        "letterSpacing": "-0.374px"
      },
      "$type": "typography",
      "$description": "Typography style for body."
    },
    "dense-link": {
      "$value": {
        "fontFamily": "SF Pro Text, system-ui, -apple-system, sans-serif",
        "fontSize": "17px",
        "fontWeight": 400,
        "lineHeight": 2.41,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for dense link."
    },
    "caption": {
      "$value": {
        "fontFamily": "SF Pro Text, system-ui, -apple-system, sans-serif",
        "fontSize": "14px",
        "fontWeight": 400,
        "lineHeight": 1.43,
        "letterSpacing": "-0.224px"
      },
      "$type": "typography",
      "$description": "Typography style for caption."
    },
    "caption-strong": {
      "$value": {
        "fontFamily": "SF Pro Text, system-ui, -apple-system, sans-serif",
        "fontSize": "14px",
        "fontWeight": 600,
        "lineHeight": 1.29,
        "letterSpacing": "-0.224px"
      },
      "$type": "typography",
      "$description": "Typography style for caption strong."
    },
    "button-large": {
      "$value": {
        "fontFamily": "SF Pro Text, system-ui, -apple-system, sans-serif",
        "fontSize": "18px",
        "fontWeight": 300,
        "lineHeight": 1,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for button large."
    },
    "button-utility": {
      "$value": {
        "fontFamily": "SF Pro Text, system-ui, -apple-system, sans-serif",
        "fontSize": "14px",
        "fontWeight": 400,
        "lineHeight": 1.29,
        "letterSpacing": "-0.224px"
      },
      "$type": "typography",
      "$description": "Typography style for button utility."
    },
    "fine-print": {
      "$value": {
        "fontFamily": "SF Pro Text, system-ui, -apple-system, sans-serif",
        "fontSize": "12px",
        "fontWeight": 400,
        "lineHeight": 1,
        "letterSpacing": "-0.12px"
      },
      "$type": "typography",
      "$description": "Typography style for fine print."
    },
    "micro-legal": {
      "$value": {
        "fontFamily": "SF Pro Text, system-ui, -apple-system, sans-serif",
        "fontSize": "10px",
        "fontWeight": 400,
        "lineHeight": 1.3,
        "letterSpacing": "-0.08px"
      },
      "$type": "typography",
      "$description": "Typography style for micro legal."
    },
    "nav-link": {
      "$value": {
        "fontFamily": "SF Pro Text, system-ui, -apple-system, sans-serif",
        "fontSize": "12px",
        "fontWeight": 400,
        "lineHeight": 1,
        "letterSpacing": "-0.12px"
      },
      "$type": "typography",
      "$description": "Typography style for nav link."
    }
  },
  "spacing": {
    "xxs": {
      "$value": "4px",
      "$type": "dimension",
      "$description": "Spacing step xxs."
    },
    "xs": {
      "$value": "8px",
      "$type": "dimension",
      "$description": "Spacing step xs."
    },
    "sm": {
      "$value": "12px",
      "$type": "dimension",
      "$description": "Spacing step sm."
    },
    "md": {
      "$value": "17px",
      "$type": "dimension",
      "$description": "Spacing step md."
    },
    "lg": {
      "$value": "24px",
      "$type": "dimension",
      "$description": "Spacing step lg."
    },
    "xl": {
      "$value": "32px",
      "$type": "dimension",
      "$description": "Spacing step xl."
    },
    "xxl": {
      "$value": "48px",
      "$type": "dimension",
      "$description": "Spacing step xxl."
    },
    "section": {
      "$value": "80px",
      "$type": "dimension",
      "$description": "Spacing step section."
    }
  },
  "radius": {
    "none": {
      "$value": "0px",
      "$type": "dimension",
      "$description": "Border radius none."
    },
    "xs": {
      "$value": "5px",
      "$type": "dimension",
      "$description": "Border radius xs."
    },
    "sm": {
      "$value": "8px",
      "$type": "dimension",
      "$description": "Border radius sm."
    },
    "md": {
      "$value": "11px",
      "$type": "dimension",
      "$description": "Border radius md."
    },
    "lg": {
      "$value": "18px",
      "$type": "dimension",
      "$description": "Border radius lg."
    },
    "pill": {
      "$value": "9999px",
      "$type": "dimension",
      "$description": "Border radius pill."
    },
    "full": {
      "$value": "9999px",
      "$type": "dimension",
      "$description": "Border radius full."
    }
  },
  "shadow": {},
  "$extensions": {
    "com.design-md-editor.source": {
      "url": "https://www.apple.com/",
      "note": "Official brand website used for visual comparison."
    }
  }
}