GamesCooking
Today’s PaperDesign System ExtractionSection: Home
Breaking News

Editorial authority, rebuilt as a product-ready design system.

A high-trust newspaper interface built from black ink, white paper, hairline rules, serif hierarchy, compact metadata and subscription CTAs.

A restrained image module uses grayscale texture, rules and caption rhythm instead of glossy product chrome.
BrandNYTimes
CategoryNews publication
PatternMasthead + dense grid
OutputProduct-composition

Newsroom patterns, not generic cards.

Die Preview nutzt NYTimes-nahe Oberflächen: Masthead, Section Nav, Lead Article Stack, dense story grid, Opinion byline blocks, breaking banner und subscription meter.

World

How a homepage balances urgency with newspaper rhythm

Columns, captions and summary text carry the information density.

Business

Subscription design keeps utility controls compact

Blue CTAs and black ink retain institutional tone.

Arts

Review modules rely on headlines, not decoration

Flat surfaces and borders replace heavy shadows.

Support independent journalism.

Subscription and paywall surfaces are direct, compact and institutional. They use strong contrast, minimal radius and blue utility actions.

Color palette.

Mostly black ink and white paper, with NYTimes blue reserved for links, subscription CTAs and utility states.

Primary#111111
Ink#121212
NYT Blue#326891
Blue Soft#567B95
Canvas#FFFFFF
Surface#F7F7F7
Elevated#EFEFEF
Muted#666666
Border#DFDFDF

Typography.

Large serif headlines, compact sans metadata and tight newspaper hierarchy.

DisplayThe Daily System72 / 800
HeadlineEditorial-first design48 / 800
SectionDense story grid32 / 750
BodyReadable serif body copy with measured line-height and newspaper cadence.16 / 1.6
LabelBreaking News12 / sans

Component language.

Buttons, labels, forms, spacing and elevation bleiben als Handoff sichtbar, aber mit NYTimes-artiger Dichte und Linienlogik.

Buttons

Section labels

OpinionAnalysisLiveReview

Forms

Radius

0
3
8
pill

Elevation

Rule
Popover
Flat card

Spacing

4px
8px
16px
40px
72px

Component tokens.

Copy-paste-fähige Variablen für Handoff an einen weiteren Agenten.

:root {
  --nytimes-primary: #111111;
  --nytimes-ink: #121212;
  --nytimes-blue: #326891;
  --nytimes-blue-soft: #567B95;
  --nytimes-canvas: #FFFFFF;
  --nytimes-surface: #F7F7F7;
  --nytimes-surface-elevated: #EFEFEF;
  --nytimes-muted: #666666;
  --nytimes-border: #DFDFDF;
  --nytimes-serif: Georgia, "Times New Roman", serif;
  --nytimes-sans: Arial, "Helvetica Neue", sans-serif;
  --nytimes-rule: 1px solid #DFDFDF;
  --nytimes-rule-strong: 2px solid #121212;
}
Source: www.designmd-store.com