Pixelgrade Pattern Language

Emerging Section

Compound Hero

Let a dominant statement, primary image, and small explanatory moment share one opening.

A page opening needs a dominant claim and image, but also one smaller piece of explanation that cannot wait for the next section.

The pattern exists because easy answers pull in opposite directions.

  1. 01

    A hero needs one unmistakable center of gravity.

  2. 02

    Supporting context earns trust but can turn an opening into a dashboard.

  3. 03

    Nested compositions offer richness while increasing responsive risk.

Preserve the relationship, not one frozen layout.

Build one dominant media-and-statement relationship, then nest a single modest supporting moment inside its quieter side. The small moment must answer the hero rather than introduce a second story.

Several forms, one underlying move.

  1. 01

    Display language beside tall media, with a small media-and-copy card beneath the language.

  2. 02

    A proposition and dominant product image with one compact proof object nested below.

A pattern includes the shape of its own misuse.

  • The nested moment becomes a competing card grid.
  • Primary and secondary media receive equal scale.
  • The supporting element survives only as decoration when its copy is removed.

2 reviewed contexts

The anatomy has worked in two reviewed settings. It still needs a second original composition to prove that the nested moment is generative.

Last reviewed: