# Figure break > A reading column interrupted by one wide photograph: the prose holds a strict measure, the figure breaks out to twice that width, and its caption hangs from a small index at the figure's left edge before the column resumes. Includes replaceable example images. States no colour and no font of its own. Canonical: https://patternpaste.com/pattern/figure-break.html Section: Editorial Access: Included in Pattern Paste access. Needs: Requires a block theme on WordPress 7.0 to 7.1. Classic themes and page builders are outside our supported setup. Adaptive patterns use the block theme’s colour, spacing and typography presets; styled variations declare their own colours or type. Blocks: group, heading, image, paragraph Keywords: editorial, article, figure, image, caption, long-form, wide ## Variations (2) ### Figure break (the default) Identical markup in every theme. ### Straw and rhubarb This variation states its own colours and states its own type: identical in every theme. A garden centre's seasonal notes: states deep leaf-green type on straw with a rhubarb accent, Georgia for the headline and reading column over Helvetica labels. The column closes on a square rhubarb See the bulb list button and an underlined Opening times link. --- ## The signature moment: the figure breaks the measure Two widths, used strictly. Everything a visitor reads is 36rem wide and centred, and one thing is not: the photograph, set `alignwide` so it runs to 74rem, twice the column, with the prose continuing at its own width above and below. The contrast between the two widths is what makes the image feel like an event in the article rather than an illustration beside it. The caption reinforces it by sitting at the figure's width, not the column's: a 6rem index (`Fig. 01`) and the caption text in a flex row aligned to the figure's left edge, so the caption belongs to the picture and the prose belongs to the column. ## How the widths work The band is a constrained group with `contentSize: 36rem` and `wideSize: 74rem`. Core's layout styles give a child with no alignment the content width and a child with `align: wide` the wide width, both centred, so the column and the figure share a centre line and the figure overhangs it by 19rem each side. Below 74rem plus padding the figure simply fills the band; below 36rem plus padding so does the column. Neither is a `vw` width. The caption row is also `alignwide` and wraps; its index is a paragraph with `layout.selfStretch: fixed` at `6rem` and the caption is a second fixed item at `32rem`, so a long caption never runs the full 74rem. Both are fixed because WordPress writes a fixed item as `flex-basis` alone, with no `flex-shrink: 0`: the first draft had the caption filling and the row `nowrap`, and at 390 the index shrank and `Fig. 01` broke across two lines (measured). ## The image The image block includes an example photograph, with `aspectRatio: 21/9` and `scale: cover`, so whatever the buyer uploads is cropped to the wide proportion the layout needs. There is no text on the photograph: its luminance is unknowable, so the caption sits under it on the band's `base` ground. ## What happens at 390 The figure and the column are both the width of the phone, which is the right answer: the break becomes a full-bleed image between two runs of text. The caption row wraps: the index sits on its own line above the caption, which then fills the width. The 21/9 crop is 167px tall at this width, a short band rather than a hero. ## What it inherits from your theme - **Typeface.** None stated. - **Palette.** `base` ground, `contrast` text, two-rung chains. The heading carries its colour explicitly. - **Image styling.** Corner radius, borders and caption styles, if your theme applies any to `core/image`, arrive with the block. - **Spacing rhythm.** Core spacing presets. ## What it decides for itself - **The two widths**: 36rem and 74rem, in `rem`. - **The crop**: 21/9, cover. - **The caption index**: a 6rem fixed column at `max(0.8125rem, 13px)`, 0.18em tracking. - **Proportion**: body at `clamp(1.0625rem, 1.45vw, 1.25rem)` on 1.75; caption at `clamp(max(0.9375rem, 15px), 1.05vw, 1rem)` on 1.6; heading at `clamp(1.875rem, 3.8vw, 2.875rem)` on 1.08. ## What you change first 1. **The image.** Select it in the editor and choose a file; the crop is set. 2. **The caption and its index.** `Fig. 01` is a placeholder; a photographer credit or a location works the same way. 3. **The copy.** Two paragraphs before the figure, two after. Add more by copying a paragraph; keep the figure roughly in the middle so it reads as a break and not as an opener. 4. **A second figure.** Copy the image and the caption row together; they are a pair. ## Contrast Every text pair is `contrast` on `base`. The heading is large text at 3:1; body and caption are held to 4.5:1. Nothing is set on the photograph. ## Included images The copied markup includes WordPress Photo Directory example photographs. The public image URLs keep the examples visible after pasting. Select an image or cover and choose **Replace** to use your own Media Library files. See [image credits](/image-credits/) for the sources and licenses. Pasting an image URL does not import a Media Library attachment.