# Post grid > A run of writing as three openings across: each is a 3:2 image frame inset in its own mat, a hairline drawn beneath it that runs wider than the picture, and under the rule a tracked kicker, a title set tight and a date. Hand-written entries in core blocks, not a query loop, so it works on a static page and every word is yours to edit. The openings sit in a grid with an 18rem minimum column, so the run is three across on a desktop, two on a tablet and one on a phone. States no colour and no font of its own. Canonical: https://patternpaste.com/pattern/post-grid.html Section: Blog 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: posts, blog, articles, writing, grid, journal, news ## Variations (2) ### Three openings (the default) Identical markup in every theme. Three articles across on your page ground, each picture inset in a mat with the hairline running past it into the type. The rules are currentColor, so they follow your text wherever your theme puts it. Example images are included with their crops set. ### Night openings Identical markup in every theme. The colour axis, done the only way the contract guarantees: the whole run inverts to your contrast with your base on it, and the mat rules follow the type because they are currentColor. Every theme has both slugs, so this arrives everywhere. --- ## The signature moment: the mat rule tying image to type Each opening is a **mat**: the picture is inset from the column's edges, and a 1px hairline is drawn beneath it that runs **wider than the picture**, out to the full width of the column. The kicker, the title and the date sit under that rule, inset by the same margin as the image above it. That one rule does the whole job. It ties the image to the type as a single object, so three openings read as three pieces rather than as a row of pictures with captions underneath. And because it runs past the image on both sides, it is a structural mark rather than a caption divider: at a glance you see three hard horizontal strokes across the section, and the pictures floating above them. The rule is `currentColor`. It cannot resolve to nothing, and it follows your text colour wherever your theme puts it, which is why the whole device survives the inversion in the variation without a single colour being restated. ## What it inherits from your theme - **The typeface.** The pattern states no font family anywhere. Kickers, titles and dates are all set in your face; the design is in the tracking and the scale, not in the family. - **Your colours.** The ground asks for `base` and the type asks for `contrast`, the two slugs every stock block theme defines, each ending on a colour WordPress itself guarantees. Nothing in the section can blank. - **Your spacing scale.** The band's padding, the gaps between openings and the mat's inset are all spacing presets, so a theme with a generous scale gets a roomier grid without you editing anything. - **Your images.** The three image blocks include example photographs, with the crop already set. Choose Replace on any image to select your own file. ## What it decides for itself - **Full bleed with its own measure.** The section spans the viewport and holds its content to 1240px, so it is a band on a page rather than another column of body text, and it does not depend on the section above or below it for air. - **A grid that reflows, not three columns that do not.** The openings sit in a `core/group` with a grid layout and an 18rem minimum column, so the row is three across on a desktop, two on a tablet and one on a phone, and it changes at the width the cards run out of room rather than at the single 782px line core draws for a Columns block. It was three columns until 2026-08-22, and at 820 that put each title in a 208px column: "The shed that taught us to measure twice" set 13 characters per line over five lines in Twenty Twenty-Four, which is a ribbon and not a headline. Nothing was hidden and no type was shrunk; the row simply stops insisting on three. - **The 3:2 crop, and `scale: cover`.** Whatever you upload is cropped to the same proportion in all three openings, so the row stays level even when your three photographs do not match. - **The mat inset, and the one thing about it that is not your theme's.** The image is padded away from the column edges and the rule is not. That asymmetry is the pattern; remove it and you have a caption. The side inset is a `clamp()` from 12px to 24px rather than a spacing preset, and that is deliberate: a preset is whatever the buyer's theme says it is, and in Twenty Twenty-Four `spacing|40` is wide enough to take 108px out of a 341px column and leave the title breaking at 19 characters even on a desktop. The top and bottom of the mat are still presets, so the section still breathes on your scale; only the two edges that decide how wide a title can be are bounded. - **The title ramp.** Titles are a `clamp()` set tight (line-height 1.15, slightly negative tracking) so a three-line title still reads as one object. Titles carry their own explicit text colour rather than inheriting it, because a theme's heading element style beats a colour set on the wrapping group. - **The kicker and date scale.** Both are small, uppercase and widely tracked, and deliberately far from the title in size: the scale gap is what makes the title read as the thing to click. ## What to change first 1. **The three titles.** They are built for six to ten words breaking over two or three lines. A one-line title leaves the mat looking short next to its neighbours. 2. **The images.** Select each frame and point it at your media library. Keep the 3:2 crop unless you change all three. 3. **The kickers.** They are a category, a series name or a section of the site. Delete the paragraph if you do not have one; the rule still ties the picture to the title. 4. **The dates.** Type them in the format your site uses. They are static text, so nothing reformats them for you. 5. **The header.** The tracked label and the one-line lede sit on a 34rem measure at the left. Delete either and the grid still reads. 6. **The count.** Three openings is the composition, and the grid means you are not adding a column when you add one: paste a fourth card into the same group and the row becomes four across where there is room for four and two where there is not. What you should not do is lower the 18rem minimum to force more across, because that is the number keeping a title out of a ribbon. ## Variations - **Night openings.** The colour axis and nothing else: the band inverts to your `contrast` ground with your `base` on it. The mat rules are `currentColor`, so they flip with the type and no rule is restated anywhere in the file. Both slugs exist in every stock block theme, so the inversion arrives everywhere. ## Notes - Core blocks only: group, paragraph, heading, image. The row of openings is a group with a grid layout, so there is no Columns block in the pattern at all. No plugin, no script, nothing to keep updated. - Every colour is a fallback chain ending on a colour WordPress guarantees, and no rule, border or divider states a colour at all: they are all `currentColor`. - Text never sits on a photograph here. The pictures carry atmosphere and the type sits on your page ground beneath them, so no image you choose can make a title hard to read. ## 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.