Article cover chapter

A full-bleed core/cover for the opening of a long-form article. An oversized chapter numeral sits beside the title, standfirst and a compact row of author, date and reading-time facts. A heavy veil turns the photograph into a quiet ground while preserving its broad landscape.

The numeral and the article copy occupy two columns, with the number taking the narrower column but carrying most of the visual weight. It reaches up to 18rem at wide widths while the title stays on the theme's xx-large rung. That scale collision marks the article as one chapter in a larger body of work without borrowing the diagonal contents-list composition from a magazine cover.

On a phone, core stacks the columns. The numeral floors at 7rem and becomes a short masthead above the title, so its scale survives without squeezing the words into a narrow strip.

It inherits the typeface, the base and contrast colours and the theme's spacing scale. It decides the 80% veil, the cover height, the two-column split, the numeral's display scale and the text measures. No nondefault colour or type axis is declared.

The cover uses a contrast overlay at dimRatio 80 and base type. This is the measured cover exception to the rule that type does not sit on a photograph: the veil bounds the possible ground strongly enough for body copy to clear 4.5:1 over both the lightest and darkest image cases. Lowering the veil below 80 removes that guarantee.

The numeral is display type with a bare clamp() because its size is the composition. The h1 uses the xx-large chain and states only its size and colour. The standfirst uses the medium chain with a 1.5 line height. Labels have their own readable floor because the theme's small preset can fall below body-copy size.

The cover is a full-width section with a 44rem minimum height. Its inner core/columns row uses roughly one third of the width for the numeral and two thirds for the article copy. The metadata is a wrapping flex group, so the three facts stay in one row when space permits and become a compact sequence on narrow screens. Horizontal padding grows with the viewport and stops at the same wide-page inset on large screens.

Replace the photograph, then change the chapter number and title. Keep the title to roughly eight words. Rewrite the standfirst as one or two sentences, then replace the author, publication date and reading time. The photograph is decorative in this composition, so its empty alt text is intentional.

The example is a reviewed WordPress Photo Directory photograph of a broad volcanic crater beneath a golden horizon. Its public URL keeps the example visible after pasting. Select the cover and choose Replace to use a Media Library image. See image credits for the source and licence. Pasting the pattern does not import the example into the Media Library.