Block / Editorial hero

A reusable article lead-in for launch notes and essays.

This block gives the marketing site and the journal the same disciplined visual introduction.

BlockEditorialThe Basel Standard

EditorialArticleHero is the top-of-page framing block for the journal system. It combines eyebrow, title, lead, metadata, and a figure rail so longform pages can open with a deliberate editorial statement instead of a generic blog header.

Installation

Purchase access, then open /account/install to issue a registry token.

Usage

import { EditorialArticleHero } from "@/registry/swiss/blocks/editorial-article-hero"

<EditorialArticleHero
  eyebrow="Launch note"
  title="A reusable article lead-in for launch notes and essays."
  lead="This block gives the marketing site and the journal the same disciplined introduction."
  meta={["12 min read", "March 2026"]}
  image={{
    src: "/image.jpg",
    alt: "Editorial reference",
    caption: "Reference image and credit.",
  }}
/>

Why This Block Exists

Longform pages need a stronger opening than a plain title and body copy stack. This block packages the most common article-opening needs into one structure so the journal can feel authored and repeatable.

• Use it at the top of articles, launch notes, essays, or case studies.
• Prefer it over ad hoc heading stacks when the page needs both narrative copy and an image rail.
• Avoid it for short utility pages or article lists where a full hero would add unnecessary weight.

Examples

Standard Journal Hero

The default hero establishes the pattern: concise eyebrow, assertive title, deck, metadata, and one strong visual.

Block / Editorial hero

A reusable article lead-in for launch notes and essays.

This block gives the marketing site and the journal the same disciplined visual introduction.

BlockEditorialThe Basel Standard

Alternate Issue Framing

You can change the tone of the metadata and artwork without changing the overall article-opening structure.

Issue 16 / Materials

A feature lead can hold title, deck, metadata, and art direction in one block.

Use a second hero variant when the article needs a different editorial mood without changing the overall page structure.

12 min readMarch 2026Journal

<EditorialArticleHero
  eyebrow="Issue 16 / Materials"
  title="A feature lead can hold title, deck, metadata, and art direction in one block."
  lead="Use a second hero variant when the article needs a different editorial mood."
  meta={["12 min read", "March 2026", "Journal"]}
  image={image}
/>

In Context

The hero should hand off cleanly to body content, figure strips, or resource modules. It is an opening argument, not a full page layout by itself.

Launch note

The hero belongs at the start of a longer editorial sequence.

This preview shows how the block can open the page before figure strips and resource lists take over.

LaunchProductSwiss

After the hero

Follow it with body copy or supporting modules, not another competing headline.

Guidance

Keep The Opening Focused

• The title should carry the main claim.
• The lead should expand that claim, not repeat it.
• Metadata should support orientation, not become a second headline.

Treat The Image As Editorial Evidence

• Choose artwork that advances the story or mood.
• Write alt text and caption copy that still make sense outside the visual layout.
• If the article does not benefit from a strong image rail, use a simpler prose opening instead.

Use One Hero Per Narrative Surface

• Do not stack another competing headline module directly underneath it.
• Follow it with body content or quieter supporting blocks.
• Keep the surrounding page width and spacing disciplined so the hero can do its job once.

API Reference

EditorialArticleHero Props

Composition Notes

The block renders a full section and expects to sit near the top of a longform page.