{
  "theme": "light",
  "category": "media",
  "tags": [
    "achromatic",
    "serif-heavy",
    "editorial",
    "dense",
    "minimal",
    "media",
    "grid-driven"
  ],
  "northStar": "America's newspaper of record on the web — Cheltenham masthead, dense print-grid layout, photojournalism front and center.",
  "description": "The New York Times website carries decades of editorial design DNA into the browser. A blackletter masthead anchors the top, headlines are set in NYT's house display serif (Cheltenham/Imperial), and body copy is a clean serif. Layout is unapologetically dense: multi-column grids, small image thumbnails, generous use of dotted dividers, italics for credits. White canvas, near-black text, and a single muted blue for links. The personality is journalistic restraint, built for reading.",
  "colors": [
    {
      "name": "neutral-900",
      "hex": "#121212",
      "group": "neutral",
      "role": "neutral step 900",
      "tailwind": {
        "name": "neutral-900",
        "hex": "#171717",
        "deltaE": 0.022
      }
    },
    {
      "name": "neutral-50-1",
      "hex": "#ffffff",
      "group": "neutral",
      "role": "neutral step 50",
      "tailwind": {
        "name": "zinc-50",
        "hex": "#fafafa",
        "deltaE": 0.015
      }
    },
    {
      "name": "neutral-950",
      "hex": "#000000",
      "group": "neutral",
      "role": "neutral step 950",
      "tailwind": null
    },
    {
      "name": "neutral-600",
      "hex": "#5a5a5a",
      "group": "neutral",
      "role": "neutral step 600",
      "tailwind": null
    },
    {
      "name": "neutral-700",
      "hex": "#333333",
      "group": "neutral",
      "role": "neutral step 700",
      "tailwind": null
    },
    {
      "name": "blue-700",
      "hex": "#2d3748",
      "group": "blue",
      "role": "blue step 700",
      "tailwind": null
    },
    {
      "name": "neutral-500",
      "hex": "#727272",
      "group": "neutral",
      "role": "neutral step 500",
      "tailwind": {
        "name": "neutral-500",
        "hex": "#737373",
        "deltaE": 0.003
      }
    },
    {
      "name": "neutral-100-1",
      "hex": "#e1e7ee",
      "group": "neutral",
      "role": "neutral step 100",
      "tailwind": {
        "name": "slate-200",
        "hex": "#e2e8f0",
        "deltaE": 0.004
      }
    },
    {
      "name": "neutral-200",
      "hex": "#c7c7c7",
      "group": "neutral",
      "role": "neutral step 200",
      "tailwind": null
    },
    {
      "name": "neutral-50-2",
      "hex": "#f8f8f8",
      "group": "neutral",
      "role": "neutral step 50",
      "tailwind": {
        "name": "gray-50",
        "hex": "#f9fafb",
        "deltaE": 0.006
      }
    },
    {
      "name": "neutral-100-2",
      "hex": "#edf2f7",
      "group": "neutral",
      "role": "neutral step 100",
      "tailwind": {
        "name": "slate-100",
        "hex": "#f1f5f9",
        "deltaE": 0.01
      }
    },
    {
      "name": "neutral-400",
      "hex": "#8b8b8b",
      "group": "neutral",
      "role": "neutral step 400",
      "tailwind": null
    },
    {
      "name": "neutral-100-3",
      "hex": "#dfdfdf",
      "group": "neutral",
      "role": "neutral step 100",
      "tailwind": {
        "name": "zinc-200",
        "hex": "#e4e4e7",
        "deltaE": 0.017
      }
    },
    {
      "name": "neutral-100-4",
      "hex": "#ebebeb",
      "group": "neutral",
      "role": "neutral step 100",
      "tailwind": {
        "name": "gray-200",
        "hex": "#e5e7eb",
        "deltaE": 0.014
      }
    }
  ],
  "surfaces": [
    {
      "level": 0,
      "name": "background",
      "hex": "#ffffff",
      "purpose": "Page background"
    },
    {
      "level": 1,
      "name": "surface-1",
      "hex": "#edf2f7",
      "purpose": "Cards / elevated panels"
    },
    {
      "level": 2,
      "name": "surface-floor",
      "hex": "#dfdfdf",
      "purpose": "Elevation tier 2"
    }
  ],
  "elevationPhilosophy": "Completely flat. Hierarchy comes from typographic weight and grid columns, not from shadow. Section bands occasionally use a near-white tint to separate Opinion / Wirecutter / Cooking, but never lift.",
  "typography": [
    {
      "family": "Times New Roman",
      "weight": "400",
      "role": "serif",
      "fontFeatureSettings": null,
      "substitute": null
    },
    {
      "family": "nyt-franklin",
      "weight": "400",
      "role": "body",
      "fontFeatureSettings": null,
      "substitute": null
    },
    {
      "family": "nyt-cheltenham",
      "weight": "700",
      "role": "body",
      "fontFeatureSettings": null,
      "substitute": null
    },
    {
      "family": "nyt-imperial",
      "weight": "400",
      "role": "body",
      "fontFeatureSettings": null,
      "substitute": null
    }
  ],
  "typeScale": [
    {
      "role": "body",
      "size": 16,
      "lineHeight": 1,
      "letterSpacing": null
    },
    {
      "role": "display",
      "size": 16,
      "lineHeight": 1,
      "letterSpacing": null
    },
    {
      "role": "h2",
      "size": 16,
      "lineHeight": 1,
      "letterSpacing": null
    },
    {
      "role": "link",
      "size": 14,
      "lineHeight": 1.4,
      "letterSpacing": null
    },
    {
      "role": "ui-action",
      "size": 14,
      "lineHeight": 1.4,
      "letterSpacing": null
    },
    {
      "role": "h3",
      "size": 13,
      "lineHeight": 1.15,
      "letterSpacing": null
    }
  ],
  "spacing": {
    "radius": {
      "none": "0",
      "sm": "3px"
    },
    "base": "1px"
  },
  "layout": "Three to four narrow columns of headline-deck-thumbnail triplets, separated by dotted gray rules. Above-the-fold runs a wide hero spanning two columns. The reading rhythm is unmistakably print-newspaper.",
  "imagery": "Photojournalism on every story — large hero photos for top stories, small thumbnails for everything else. Black-and-white archival imagery for retrospectives, color for breaking news. Photo captions in italic gray.",
  "dos": [
    "Set headlines in a serif display face (Cheltenham/Imperial); body in a sans or readable serif",
    "Use a multi-column print grid with thin gray dividers between articles",
    "Reserve color for links and section badges; keep the canvas near-white",
    "Pair small thumbnail photos with dense headline-deck-byline triplets"
  ],
  "donts": [
    "Don't use rounded buttons or pill UI — the voice is journalistic, not consumer",
    "Don't introduce additional accent colors beyond NYT's editorial blue",
    "Don't break the grid for marketing-style hero blocks — the homepage is a newsroom",
    "Don't reduce information density; readers come to scan many stories quickly"
  ],
  "brandColor": null
}