Team grid: WordPress Block Pattern, Pattern Paste Canonical: https://patternpaste.com/pattern/team-grid.html Core Patterns (https://patternpaste.com/patterns/) Team (https://patternpaste.com/patterns/team/) Free Standard # Team grid Six people across two even rows of three, each a 4:5 portrait with a name, a tracked role and one line of what that person is for. Nothing is drawn around anybody: no card, no plate and no rule, so the six frames at one size are the only structure in the section. Example portraits are included, generated and nobody real; replace them with photographs of your own people. ## All patterns Search patterns Loading patterns… Start here ## What you change first - The six people. Six names, six roles, six sentences, six pictures. - The pictures. Point each frame at your media library. - The count. The rows are independent core/columns. - The bio length. Hold every sentence to about eighty characters. The signature moment ## Six at exactly the same size The section is an argument made entirely by repetition. Six frames, one crop, one heading size, one role size, one sentence each, and no container of any kind. No card, no plate, no border, no rule. The only structure in the whole section is that the six things are identical and evenly spaced, which is enough to make a grid and is much harder to get wrong than a card. Theme handoff ## What comes from where ### From your theme - Typeface. - Palette. - Spacing scale. ### Set by this pattern - The crop, and it is the same crop for everybody. - The frames include example portraits, generated and nobody real. - Type never sits on a photograph. - Three across, guaranteed rather than reasoned about. - A bottom-aligned two-column opening. - Three sizes of type and nothing else. - No links. Full pattern notes ## Why it works, and how it is built Open a topic for the complete design reasoning, editing guidance and implementation notes. Design rationaleComposition, intent and nearest alternatives ### Overview Six people across two even rows of three. Each person is a 4:5 portrait with their name, a tracked role and one line about what they are for, and there is nothing drawn around anybody. It is the plainest of the portrait sections: team-portraits puts its people between hairlines and gives them no bio, team-lead-portrait ranks one of them, and this one refuses to do either. ### The signature moment: six at exactly the same size The section is an argument made entirely by repetition. Six frames, one crop, one heading size, one role size, one sentence each, and no container of any kind. No card, no plate, no border, no rule. The only structure in the whole section is that the six things are identical and evenly spaced, which is enough to make a grid and is much harder to get wrong than a card. Two consequences are worth the price. The first is that nothing outranks anything: a team section built from cards tends to grow a featured card, and a team section built from a hairline strip makes the strip the subject. Here the subject is six faces, and the eye reads them as a set before it reads any name. The second is that the bio line is what sets the rhythm. Every person gets one sentence of roughly the same length, so the six blocks of text are the same height, the two rows sit on the same baseline, and the grid looks measured rather than assembled. It survives colourlessness because there is no colour in it to take away. Every mark on the page is either a photograph or a piece of type, and the composition is carried by the fact that they repeat. Make it yoursVariations and the edits to make first ### What you change first - The six people. Six names, six roles, six sentences, six pictures. The sentence is the thing worth writing: it is the only place anybody gets a voice, and it sets the height of the row. - The pictures. Point each frame at your media library. They do not have to be shot to 4:5; the crop is applied for you. They do have to be shot at roughly the same distance, because six frames at one size put a head-and- shoulders next to a full-length figure and nothing hides the difference. - The count. The rows are independent core/columns. Delete the second for a team of three, copy it for nine. Keep three to a row: four columns at 820px leave roughly 175px a person, which is too little for a face and a sentence. - The bio length. Hold every sentence to about eighty characters. The moment one runs to three lines and the others run to two, the second row stops agreeing with the first and the grid reads as a mistake. Theme behaviourInheritance, fixed decisions and contrast ### What it inherits from your theme - Typeface. The pattern states no font family. The names, the tracked roles and the bios all arrive in your serif or your sans, and the section is largely a test of how your face handles a small tracked capital next to a reading-size name. - Palette. The ground is your base and every piece of text is your contrast, both as fallback chains ending on a colour WordPress itself guarantees. There is no third colour in the section. - Spacing scale. Section padding, the gap between the two rows, the gutter between people and the air between a frame and its name are core spacing presets, so density follows your theme. ### What it decides for itself - The crop, and it is the same crop for everybody. Every image block is aspectRatio: 4/5 with scale: cover, so whatever the buyer uploads is cut to the same frame rather than published at whatever shape the camera left it. 4:5 is a little squarer than a studio portrait, which suits a grid: a taller frame in two rows of three pushes the second row off most screens. - The frames include example portraits, generated and nobody real. Their public image URLs travel with the copied pattern. Choose Replace to select photographs of your own people, keeping the crop and layout already set. - Type never sits on a photograph. Name, role and bio are below the frame, on the section's own ground. A portrait's luminance is as unknowable as an accent's, because the buyer chooses the image. - Three across, guaranteed rather than reasoned about. Two separate core/columns rows of three, not a grid layout and not a wrapping flex row. Core gives a column flex-grow:1; flex-basis:0; min-width:0, so three never wrap above 782px, and core stacks them one per line below it. A grid with a minimum column width would pack four across on a wide screen and leave two people on a short second row. - A bottom-aligned two-column opening. The heading takes 58% and the lede 42%, both aligned on their last line, so the two blocks of type finish together whatever length either one is. Core writes the alignment onto each child column, never onto the row, because a core/columns verticalAlignment does nothing on the front end. - Three sizes of type and nothing else. The name is the large rung, the role is a small tracked uppercase label with its own clamp(), and the bio is medium. The role is a paragraph rather than a heading, because a heading in this catalogue may not state its own case or tracking. - No links. Nothing in the section is tappable. An inline link's height comes from the font's em box, which a pattern stating no font cannot raise to a 44px target, so that is the buyer's decision to make with their own type. Technical notesBlock mechanics, responsive behaviour and constraints ### Included images The copied markup includes example portraits, generated and nobody real. The public image URLs keep the examples visible after pasting. Select an image or cover and choose Replace to use photographs of your own people. See image credits (https://patternpaste.com/image-credits/) for the sources. Pasting an image URL does not import a Media Library attachment. Questions ## Team grid: common questions Does Team grid need a plugin? No. It is built only from core WordPress blocks (column, columns, group, heading, image and paragraph), so it pastes into the block editor with nothing to install. Will Team grid match my theme? Yes. It names no colour or font of its own: every colour, size and space is a preset from your theme, so it takes your theme’s palette and type when pasted. Can I use my own images? Yes. Sample images stay in the copied blocks. Replace them in WordPress; pasting does not upload them to your Media Library. Is Team grid free? Yes. It is one of 64 free Core Patterns: copy it and it is yours to keep and edit. Which WordPress version does it need? 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. Back to Core Patterns (https://patternpaste.com/patterns/) ### Free pattern Copy it and paste it straight into the block editor. It is yours to keep and edit. Read the markup #### Pair with Hero Hero aperture An opening section on your theme's own paper: a tracked line, a display headline, one short paragraph on a reading measure, and then a picture that stops short of the edge on every side. The signature is the margin: the image is a window cut in the page rather than a band across it, and the paper around it is what you notice. A small opaque plate in the picture's bottom-right corner carries the caption, so no type ever sits on the photograph. The still-image version includes an example photograph; select your own clip for the video version. States no colour and no font of its own. (https://patternpaste.com/pattern/hero-aperture.html)Editorial Article footer The close of an article: a portrait of the author beside their name, the biography under both inside a currentColor slip held to the middle half of the measure, and the previous and the next post hanging off the two outer edges so the section reads as a doorway rather than a footer. The name, the biography and the two neighbours are dynamic core blocks, so they are the post's own and the preview here is sample data; the portrait is an ordinary image block you swap for your author's own. The previous and next links only resolve on a single post template, which is where this pattern belongs. (https://patternpaste.com/pattern/article-footer.html)Contact Contact cover ledger A full-bleed contact cover: a display heading in the top left, and a ruled ledger of address, hours, phone and email in the far lower-right corner, label left and value right between hairline rules, with the photograph running between them. A heavy veil of your theme's contrast colour keeps every line legible whatever photograph you choose. The ledger drops under the heading on a phone. Includes a replaceable example photograph. States no colour and no font of its own. Ships with a short hand-off row on your theme's paper below it. (https://patternpaste.com/pattern/contact-cover-ledger.html) #### Before you paste 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. How we test patterns (https://patternpaste.com/how-we-test/) Sample images stay in the copied blocks. Replace them in WordPress; pasting does not upload them to your Media Library. Video variations need your own clip. Image credits (https://patternpaste.com/image-credits/). ## Specifications Section Team Access Free Plugin None, core blocks only Variations 1 Colour From your theme Type From your theme Motion None Blocks column, columns, group, heading, image, paragraph Presets color 5, spacing 7, font-size 3 WordPress 7.0+ Continue exploring ## Next in Team Explore all 29 Team patterns (https://patternpaste.com/patterns/team/) Shot in Twenty Twenty-Five Team No plugin needed ### Team founders diptych Two generous portraits sit side by side, with separate biographies and a shared studio statement beneath. Team Preview pattern (https://patternpaste.com/pattern/team-founders-diptych.html) Shot in Twenty Twenty-Five Team No plugin needed ### Team introduction and face grid An introduction occupies one side of the section, opposite a compact responsive grid of nine square portraits and names. Team Preview pattern (https://patternpaste.com/pattern/team-intro-face-grid.html) Shot in Twenty Twenty-Five Team No plugin needed ### Team lead portrait One person opens the section: a tall 2:3 portrait beside their name one rung under the section heading and two lines about them, with three colleagues held in a hairline strip beneath. Team Preview pattern (https://patternpaste.com/pattern/team-lead-portrait.html)