{
  "schemaVersion": 1,
  "source": {
    "sourceName": "getdesign.md",
    "originalDetailUrl": "https://getdesign.md/apple/design-md",
    "fallbackRawUrl": "https://raw.githubusercontent.com/VoltAgent/awesome-design-md/main/design-md/apple/DESIGN.md",
    "mirrorSource": "github:VoltAgent/awesome-design-md",
    "websiteUrl": "https://apple.com/"
  },
  "identity": {
    "id": "P0-51",
    "slug": "apple",
    "brand": "Apple",
    "titleZh": "Apple 主题",
    "titleEn": "Apple",
    "descriptionZh": "Apple 的 Design.md 主题展示，围绕消费品牌、媒体内容、高级质感、电商零售组织页面。",
    "descriptionEn": "Consumer electronics. Premium white space, SF Pro, cinematic imagery."
  },
  "tags": {
    "sourceTags": [],
    "generatedTags": [
      "consumer",
      "request-flow",
      "media",
      "premium"
    ],
    "designTags": [],
    "distributionTags": [
      "消费品牌",
      "媒体内容",
      "高级质感",
      "电商零售",
      "品牌展示",
      "移动端",
      "内容货架",
      "趣味互动"
    ]
  },
  "assets": {
    "designMd": {
      "path": "DESIGN.md",
      "sourcePath": ".local/design-md-batch-regression/getdesign/apple/DESIGN.md"
    },
    "tailwind": {
      "path": "tw.css",
      "sourcePath": ".local/design-md-batch-regression/getdesign/apple/tw.css"
    },
    "tokens": {
      "path": "assets/tokens.json",
      "method": "derived_from_design_md_and_metadata"
    },
    "cover": null,
    "previewHtml": {
      "type": "local-preview",
      "path": "assets/official-homepage.webp",
      "publicPath": "assets/official-homepage.webp",
      "importPath": "./assets/official-homepage.webp?url",
      "sourcePath": "assets/official-homepage.webp"
    }
  },
  "tokens": {
    "palette": [
      "#0066cc",
      "#0071e3",
      "#1d1d1f",
      "#2997ff",
      "#ffffff",
      "#cccccc",
      "#333333",
      "#7a7a7a",
      "#f0f0f0",
      "#e0e0e0",
      "#f5f5f7",
      "#fafafc"
    ],
    "typography": {
      "display": "SF Pro Display",
      "body": "SF Pro Text",
      "mono": "ui-monospace",
      "hints": [
        "SF Pro Display",
        "SF Pro Text",
        "ui-monospace",
        "SF Pro",
        "Inter"
      ]
    },
    "radius": {
      "control": "9999px",
      "card": "18px",
      "preview": "0px",
      "pill": "9999px",
      "source": "design-md"
    },
    "spacing": {
      "xxs": "4px",
      "xs": "8px",
      "sm": "12px",
      "md": "17px",
      "lg": "24px",
      "xl": "32px",
      "xxl": "48px",
      "section": "80px",
      "source": "design-md"
    }
  },
  "previewImages": [
    {
      "type": "local-preview",
      "path": "assets/official-homepage.webp"
    }
  ],
  "display": {
    "brand": "Apple 主题",
    "brandAlias": "Apple",
    "description": "Apple 的 Design.md 主题展示，围绕消费品牌、媒体内容、高级质感、电商零售组织页面。",
    "descriptionEn": "Consumer electronics. Premium white space, SF Pro, cinematic imagery.",
    "variant": "consumer-commerce",
    "distributionTags": [
      "消费品牌",
      "媒体内容",
      "高级质感",
      "电商零售",
      "品牌展示",
      "移动端",
      "内容货架",
      "趣味互动"
    ],
    "fontStylesheets": [],
    "palette": [
      {
        "color": "#0066cc",
        "labelZh": "主色",
        "labelEn": "Primary",
        "textColor": "#ffffff"
      },
      {
        "color": "#0071e3",
        "labelZh": "主色悬停",
        "labelEn": "Primary Hover",
        "textColor": "#ffffff"
      },
      {
        "color": "#1d1d1f",
        "labelZh": "辅助色",
        "labelEn": "Secondary",
        "textColor": "#ffffff"
      },
      {
        "color": "#2997ff",
        "labelZh": "强调色",
        "labelEn": "Accent",
        "textColor": "#ffffff"
      },
      {
        "color": "#ffffff",
        "labelZh": "背景色",
        "labelEn": "Background",
        "textColor": "#171717"
      },
      {
        "color": "#cccccc",
        "labelZh": "表面色",
        "labelEn": "Surface",
        "textColor": "#171717"
      },
      {
        "color": "#333333",
        "labelZh": "文本色",
        "labelEn": "Text",
        "textColor": "#ffffff"
      },
      {
        "color": "#7a7a7a",
        "labelZh": "边框色",
        "labelEn": "Border",
        "textColor": "#ffffff"
      },
      {
        "color": "#f0f0f0",
        "labelZh": "颜色 9",
        "labelEn": "Color 9",
        "textColor": "#171717"
      },
      {
        "color": "#e0e0e0",
        "labelZh": "颜色 10",
        "labelEn": "Color 10",
        "textColor": "#171717"
      },
      {
        "color": "#f5f5f7",
        "labelZh": "颜色 11",
        "labelEn": "Color 11",
        "textColor": "#171717"
      },
      {
        "color": "#fafafc",
        "labelZh": "颜色 12",
        "labelEn": "Color 12",
        "textColor": "#171717"
      }
    ],
    "shadows": [
      {
        "label": "阴影 1 - Shadow 1",
        "value": "rgba(0, 0, 0, 0.22) 3px 5px 30px",
        "cssValue": "rgba(0, 0, 0, 0.22) 3px 5px 30px",
        "description": "Density is unusually low even by contemporary SaaS standards. Each tile occupies roughly one viewport, and there is no decorative chrome — no borders, no gradients, no decorative frames, no shadows on headlines. Elevation appears only when a product image rests on a surface (a single soft `rgba(0, 0, 0, 0.22) 3px 5px 30px` drop for visual weight). The result is a catalog that feels more like a museum gallery: the wall disappears and the artifact takes over."
      },
      {
        "label": "阴影 2 - Shadow 2",
        "value": "outline: 2px solid",
        "cssValue": "outline: 2px solid",
        "description": "Focus Blue (`{colors.primary-focus}` — #0071e3): A marginally brighter sibling of Action Blue, reserved for the keyboard focus ring on buttons (`outline: 2px solid`)."
      },
      {
        "label": "阴影 3 - Shadow 3",
        "value": "rgba(0, 0, 0, 0.04)",
        "cssValue": "rgba(0, 0, 0, 0.04)",
        "description": "Divider Soft (`{colors.divider-soft}` — #f0f0f0): The \"border\" tone on secondary buttons — functions as a ring shadow rather than a hard line. In production, often applied as `rgba(0, 0, 0, 0.04)`."
      },
      {
        "label": "阴影 4 - Shadow 4",
        "value": "rgba(0, 0, 0, 0.22) 3px 5px 30px 0",
        "cssValue": "rgba(0, 0, 0, 0.22) 3px 5px 30px 0",
        "description": "| Product shadow | `rgba(0, 0, 0, 0.22) 3px 5px 30px 0` | Product renders resting on a surface (the only true \"shadow\" in the system) |"
      }
    ],
    "borders": [
      {
        "label": "边框 1 - Border 1",
        "value": "#e0e0e0",
        "cssValue": "#e0e0e0",
        "description": "hairline: \"#e0e0e0\""
      },
      {
        "label": "边框 2 - Border 2",
        "value": "#f0f0f0",
        "cssValue": "#f0f0f0",
        "description": "divider-soft: \"#f0f0f0\""
      },
      {
        "label": "边框 3 - Border 3",
        "value": "rgba(0, 0, 0, 0.08)",
        "cssValue": "rgba(0, 0, 0, 0.08)",
        "description": "| Soft hairline | 1px `rgba(0, 0, 0, 0.08)` border | Utility cards, sub-nav frosted-glass separator |"
      }
    ],
    "typography": [
      "SF Pro Display",
      "SF Pro Text",
      "ui-monospace",
      "SF Pro",
      "Inter"
    ],
    "previewImages": [
      {
        "type": "local-preview",
        "path": "assets/official-homepage.webp"
      }
    ],
    "panels": [
      {
        "eyebrow": "品牌",
        "title": "第一眼识别明确",
        "body": "适合消费品牌、电商、媒体和产品展示页。"
      },
      {
        "eyebrow": "Token",
        "title": "颜色与字体可复用",
        "body": "页面从本地 metadata 与 Design.md 提取 palette、typography 和标签，用于快速预览主题质感。"
      },
      {
        "eyebrow": "组件",
        "title": "面向真实界面片段",
        "body": "按钮、输入、卡片和间距样例保持克制，便于比较不同主题的系统性差异。"
      }
    ],
    "usageGuidance": {
      "do": [
        "建议：Use {colors.primary} (Action Blue #0066cc) for every interactive element — links, pill CTAs, focus signals — and nothing else. The single accent is non-negotiable。",
        "建议：Set headlines in {typography.hero-display} or {typography.display-lg} with negative letter-spacing ({-0.28 → -0.374px}) to get the signature \"Apple tight\" cadence。",
        "建议：Run body copy at {typography.body} (17px / 400 / 1.47 / -0.374px) — not 16px. The extra pixel defines the brand's reading pace。",
        "建议：Alternate {component.product-tile-light} (or parchment) and {component.product-tile-dark} for full-bleed section rhythm. The color change IS the divider。",
        "建议：Reserve {rounded.pill} for the primary blue CTA and any other element that should read as an \"action\" (configurator chips, search input, sticky bar CTA)。"
      ],
      "dont": [
        "避免：introduce a second accent color; every \"click me\" signal is {colors.primary} (Action Blue)。",
        "避免：add shadows to cards, buttons, or text — shadow is reserved for product imagery。",
        "避免：use gradients as decorative backgrounds; atmosphere comes from photography。",
        "避免：set body copy at weight 500 — Apple's ladder is 300 / 400 / 600 / 700, with 500 deliberately absent. Body is always 400; strong inline is 600; display is 600。",
        "避免：round full-bleed tiles — tiles are rectangular and edge-to-edge; the color change is the divider。"
      ]
    },
    "radius": {
      "control": "9999px",
      "card": "18px",
      "preview": "0px",
      "pill": "9999px",
      "source": "design-md"
    },
    "spacing": {
      "xxs": "4px",
      "xs": "8px",
      "sm": "12px",
      "md": "17px",
      "lg": "24px",
      "xl": "32px",
      "xxl": "48px",
      "section": "80px",
      "source": "design-md"
    }
  },
  "status": {
    "displayPage": "done",
    "collectionErrors": []
  }
}
