Files
training/.codex/skills/hallmark/references/genres/editorial.md
2026-07-28 19:31:07 +08:00

4.0 KiB
Raw Blame History

Genre — editorial (default)

The canonical Hallmark voice. Pages built for content-led briefs: portfolios, manifestos, type specimens, agency sites, magazine pieces, indie podcasts, bakery / brand stories, considered B2C marketing.

This is what Hallmark looks like when no other genre signal fires. It is the silent default.

When to pick it

Default. Pick editorial when the brief does not name a specialised aesthetic — when the user said "a landing page for X" without telling you whether X is enterprise, atmospheric, or playful. Most briefs land here.

Themes that belong

Specimen, Newsprint, Atelier, Garden, Almanac, Studio, Riso, Sport, Brutal, Manifesto, Editorial, Carnival. Twelve themes — plenty of variety inside the genre.

Carnival is the loud-maximalist editorial register — Dropout TV / Fly.io / Stones Throw / Third Man Records. Duo-tone accent system (mustard + oxblood), chunky variable display, decorative ornaments, hard-offset shadows. The loud sibling to Riso / Manifesto / Brutal.

Voice

  • Display — roman serif, condensed sans, or display-heavy. Not Inter. Not Geist. The weight commits to an extreme (300 or 700+). Italic is body-emphasis only — never the header face (global rule).
  • Body — workhorse serif (Newsreader, Cormorant) or a plain non-default sans (The Future, Söhne). Readable at 4575 ch.
  • Accent — single warm or cool hue, used at < 5 % of any viewport.
  • Layout — asymmetric. Hairlines, not card borders. Generous whitespace.
  • Motion — quiet. One orchestrated entrance. No bounces.
  • Copy tone — specific, hand-set, slightly literary. Verbs over adjectives.

What this genre allows

  • Hairline rules, fleurons, drop caps, double rules.
  • Italic body in long-form content.
  • Asymmetric column counts (2:5, 3:7) on prose pages.
  • Hand-built SVG illustrations, pure-CSS art (Tier A enrichment).
  • Numbered display labels, edge-aligned headlines.
  • Single-accent-colour highlighting (<mark> band at x-height).

What this genre disallows

The universal slop-test gates apply, plus these editorial-specific bans:

  • Pill-rounded buttons with gradient fill — pill is fine, gradient on a pill is not.
  • Centred-everything heroes (gate 6 universal). Editorial heroes are left-biased or asymmetric.
  • Card-in-card layouts (gate 4 universal).
  • Three-column equal-icon-tile feature grid (gate 3 universal).
  • Glassmorphism — never; the medium is paper, not glass.
  • Pure black or pure white as paper or ink (gate 7). Tint everything toward the anchor.

Voice fixtures

Each macrostructure under editorial picks from these opening-line patterns. Imitate the shape, not the wording.

  • "Type, set with care."
  • "Print discipline, on screen."
  • "A small skill that argues against the average."
  • "We compose the page like a broadsheet — hairlines, columns, restraint."
  • "Restraint, repeated, becomes a signature."
  • Default nav: N6 Newspaper masthead — full-width, large centred wordmark, thin issue/date row in serif small caps, double-rule below. Reads as broadsheet.
  • Acceptable also: N1a Wordmark + 2 links (when destinations are minimal); N9 Edge-aligned minimal (when the page is letter-shaped or atelier-quiet).
  • Default footer: Ft1 Mast-headed (wordmark anchors a single horizontal band, tagline + small links beside).
  • Acceptable also: Ft2 Inline single line; Ft4 Dense colophon (newsprint / almanac voices); Ft6 Letter close (atelier / garden / personal); Ft7 Newsletter-first (when the brand legitimately publishes).
  • Banned for editorial: N5 Floating pill (modern-minimal vocabulary), N7 Brutal slab (fights the restraint), Ft8 Marquee scroll (kinetic; wrong genre).

See component-cookbook.md § Navigation and § Footers for the full archetypes + code.

Stamp signature

Output's CSS comment header reads:

/* Hallmark · genre: editorial · macrostructure: <name> · theme: <name> · enrichment: <tier> · nav: <N#> · footer: <Ft#> */