Pattern Paste
Subscribe

Core Patterns Hero

FreeStandard

Split hero

An asymmetric hero with a headline, supporting copy and actions in one top-aligned column, beside a compact four-row facts panel.

An overrunning rule ties the two sides together.

All patterns

Loading patterns…

Theme
Preview size
Look

Takes your theme’s colours and type.

Twenty Twenty-Five·1280px

Manrope typefacergb(255, 255, 255) ground1280px viewport

Start here

What to change first

  1. Replace the headline and short supporting paragraph.
  2. Replace the four facts and their labels.
  3. Update both action labels and their links.

The signature moment

Scale collision

A large headline meets four short, numbered facts. A structural rule extends to 80% of the band, crossing the gap between the 62% introduction and the 34% facts column.

Theme handoff

What comes from where

From your theme

Every typeface, heading leading, the xx-large heading rung, medium body rung, spacing rhythm and button shape. Base and contrast colour chains end in the core white and black presets. Eyebrows use the optional label role; the outlined action uses the link role.

Set by this pattern

A full-width band with a 1240px inner measure, a 62/34 split, an 80% rule and top alignment. Fluid horizontal panel padding preserves room for the facts on narrow screens. The facts panel has an opaque base ground and a currentColor border.

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

An asymmetric opening section with a complete introduction beside a compact facts panel.

The signature moment: scale collision

A large headline meets four short, numbered facts. A structural rule extends to 80% of the band, crossing the gap between the 62% introduction and the 34% facts column.

The introduction starts level with the facts panel. Its paragraph and actions stay directly under its heading, so a taller facts panel cannot leave an empty pocket above the headline. The facts use explicit row gaps rather than accumulating paragraph and separator margins.

Make it yoursVariations and the edits to make first

What to change first

  1. Replace the headline and short supporting paragraph.
  2. Replace the four facts and their labels.
  3. Update both action labels and their links.
Theme behaviourInheritance, fixed decisions and contrast

What it inherits from your theme

Every typeface, heading leading, the xx-large heading rung, medium body rung, spacing rhythm and button shape. Base and contrast colour chains end in the core white and black presets. Eyebrows use the optional label role; the outlined action uses the link role.

What it decides for itself

A full-width band with a 1240px inner measure, a 62/34 split, an 80% rule and top alignment. Fluid horizontal panel padding preserves room for the facts on narrow screens. The facts panel has an opaque base ground and a currentColor border.

Display type

The h1 follows the xx-large theme ladder with a 2.75–4.5rem fallback. Body copy follows medium with a 1.6 line-height. Compact fact copy is 15–16px; numbered uppercase labels are 15–16px with tracking.

Contrast

Body text targets 4.5:1 and the large heading 3:1. Text sits on base with contrast ink; rules use contrast or currentColor. The verification sheet measures the three authoring themes.

Technical notesBlock mechanics, responsive behaviour and constraints

Responsive behaviour

Core columns stack below 782px. The headline, paragraph and actions form one uninterrupted column before the facts. There are no fixed section heights or bottom-alignment offsets.

Blocks and editing

Core blocks only. No companion plugin, script, custom CSS or fixed font is needed.

Questions

Split hero: common questions

Does Split hero need a plugin?

No. It is built only from core WordPress blocks (button, buttons, column, columns, group, heading and paragraph), so it pastes into the block editor with nothing to install.

Will Split hero match my theme?

Choose by variation. Split hero takes your theme’s palette; Folio brings its own colours.

How many variations does Split hero have?

2: Split hero and Folio. Each is its own markup; choose one in the toolbar above the preview before you copy.

Is Split hero free?

Yes. It is one of 62 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.

The markup

Core block markup and nothing else. Copy it, then paste it straight into the block editor: WordPress reads the delimiters and rebuilds the blocks. This is the file as authored; the copy button on the stage applies the finish you chose there.

11,503 bytes
<!-- wp:group {"align":"full","style":{"color":{"text":"var(--wp--preset--color--contrast, var(--wp--preset--color--black))","background":"var(--wp--preset--color--base, var(--wp--preset--color--white))"},"spacing":{"padding":{"top":"var:preset|spacing|70","bottom":"var:preset|spacing|70","left":"clamp(1.25rem, 4vw, 4rem)","right":"clamp(1.25rem, 4vw, 4rem)"},"blockGap":"var:preset|spacing|50"},"elements":{"heading":{"color":{"text":"currentColor"}},"link":{"color":{"text":"currentColor"}}}},"layout":{"type":"constrained","contentSize":"1240px"}} -->
<div class="wp-block-group alignfull has-text-color has-background has-link-color" style="color:var(--wp--preset--color--contrast, var(--wp--preset--color--black));background-color:var(--wp--preset--color--base, var(--wp--preset--color--white));padding-top:var(--wp--preset--spacing--70);padding-right:clamp(1.25rem, 4vw, 4rem);padding-bottom:var(--wp--preset--spacing--70);padding-left:clamp(1.25rem, 4vw, 4rem)"><!-- wp:paragraph {"style":{"color":{"text":"var(--wp--preset--color--role-label, var(--wp--preset--color--contrast, var(--wp--preset--color--black)))"},"spacing":{"margin":{"bottom":"0"}},"typography":{"fontSize":"clamp(0.9375rem, 1vw, 1rem)","lineHeight":"1.3","letterSpacing":"0.12em","textTransform":"uppercase"}}} -->
<p class="has-text-color" style="color:var(--wp--preset--color--role-label, var(--wp--preset--color--contrast, var(--wp--preset--color--black)));margin-bottom:0;font-size:clamp(0.9375rem, 1vw, 1rem);letter-spacing:0.12em;line-height:1.3;text-transform:uppercase">Pattern library</p>
<!-- /wp:paragraph -->

<!-- wp:group {"style":{"spacing":{"blockGap":"0"}},"layout":{"type":"constrained","contentSize":"80%","justifyContent":"left"}} -->
<div class="wp-block-group"><!-- wp:group {"style":{"color":{"background":"var(--wp--preset--color--contrast, var(--wp--preset--color--black))"},"spacing":{"padding":{"top":"4px"},"blockGap":"0"}},"layout":{"type":"constrained","contentSize":"1240px"}} -->
<div class="wp-block-group has-background" style="background-color:var(--wp--preset--color--contrast, var(--wp--preset--color--black));padding-top:4px"></div>
<!-- /wp:group --></div>
<!-- /wp:group -->

<!-- wp:columns {"verticalAlignment":"top","style":{"spacing":{"margin":{"bottom":"0"},"blockGap":{"top":"var:preset|spacing|40","left":"var:preset|spacing|60"}}}} -->
<div class="wp-block-columns are-vertically-aligned-top" style="margin-bottom:0"><!-- wp:column {"verticalAlignment":"top","width":"62%"} -->
<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:62%"><!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|40"}},"layout":{"type":"constrained","contentSize":"44rem","justifyContent":"left"}} -->
<div class="wp-block-group"><!-- wp:heading {"level":1,"style":{"spacing":{"margin":{"bottom":"0"}},"typography":{"fontSize":"var(--wp--preset--font-size--xx-large, clamp(2.75rem, 5vw, 4.5rem))"}}} -->
<h1 class="wp-block-heading" style="margin-bottom:0;font-size:var(--wp--preset--font-size--xx-large, clamp(2.75rem, 5vw, 4.5rem))">Sections that arrive already wearing your theme.</h1>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"spacing":{"margin":{"bottom":"0"}},"typography":{"fontSize":"var(--wp--preset--font-size--medium, clamp(1rem, 1.2vw, 1.125rem))","lineHeight":"1.6"}}} -->
<p style="margin-bottom:0;font-size:var(--wp--preset--font-size--medium, clamp(1rem, 1.2vw, 1.125rem));line-height:1.6">Core blocks that take their colours and typefaces from your theme. Paste a section into the editor and make it your own.</p>
<!-- /wp:paragraph -->

<!-- wp:buttons {"style":{"spacing":{"margin":{"top":"var:preset|spacing|40"},"blockGap":"var:preset|spacing|30"}}} -->
<div class="wp-block-buttons" style="margin-top:var(--wp--preset--spacing--40)"><!-- wp:button {"style":{"spacing":{"padding":{"top":"1rem","bottom":"1rem","left":"1.75rem","right":"1.75rem"}}}} -->
<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" style="padding-top:1rem;padding-right:1.75rem;padding-bottom:1rem;padding-left:1.75rem" href="/patterns/">Browse the catalogue</a></div>
<!-- /wp:button -->

<!-- wp:button {"style":{"color":{"background":"transparent","text":"var(--wp--preset--color--role-link, var(--wp--preset--color--contrast, var(--wp--preset--color--black)))"},"border":{"width":"1px","color":"currentColor"},"spacing":{"padding":{"top":"1rem","bottom":"1rem","left":"1.75rem","right":"1.75rem"}}}} -->
<div class="wp-block-button"><a class="wp-block-button__link has-text-color has-background has-border-color wp-element-button" style="border-color:currentColor;border-width:1px;color:var(--wp--preset--color--role-link, var(--wp--preset--color--contrast, var(--wp--preset--color--black)));background-color:transparent;padding-top:1rem;padding-right:1.75rem;padding-bottom:1rem;padding-left:1.75rem" href="/theme/">Take the free theme</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons --></div>
<!-- /wp:group --></div>
<!-- /wp:column -->

<!-- wp:column {"verticalAlignment":"top","width":"34%"} -->
<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:34%"><!-- wp:group {"style":{"border":{"color":"currentColor","width":"1px"},"color":{"text":"var(--wp--preset--color--contrast, var(--wp--preset--color--black))","background":"var(--wp--preset--color--base, var(--wp--preset--color--white))"},"spacing":{"padding":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|50","left":"clamp(1.25rem, 3vw, 3rem)","right":"clamp(1.25rem, 3vw, 3rem)"},"blockGap":"var:preset|spacing|30"},"elements":{"heading":{"color":{"text":"currentColor"}},"link":{"color":{"text":"currentColor"}}}},"layout":{"type":"constrained","contentSize":"28rem","justifyContent":"left"}} -->
<div class="wp-block-group has-border-color has-text-color has-background has-link-color" style="border-color:currentColor;border-width:1px;color:var(--wp--preset--color--contrast, var(--wp--preset--color--black));background-color:var(--wp--preset--color--base, var(--wp--preset--color--white));padding-top:var(--wp--preset--spacing--50);padding-right:clamp(1.25rem, 3vw, 3rem);padding-bottom:var(--wp--preset--spacing--50);padding-left:clamp(1.25rem, 3vw, 3rem)"><!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|20","padding":{"top":"0"}}},"layout":{"type":"constrained","contentSize":"1240px"}} -->
<div class="wp-block-group" style="padding-top:0"><!-- wp:paragraph {"style":{"color":{"text":"var(--wp--preset--color--role-label, var(--wp--preset--color--contrast, var(--wp--preset--color--black)))"},"spacing":{"margin":{"bottom":"0"}},"typography":{"fontSize":"clamp(0.9375rem, 1vw, 1rem)","lineHeight":"1.3","letterSpacing":"0.12em","textTransform":"uppercase"}}} -->
<p class="has-text-color" style="color:var(--wp--preset--color--role-label, var(--wp--preset--color--contrast, var(--wp--preset--color--black)));margin-bottom:0;font-size:clamp(0.9375rem, 1vw, 1rem);letter-spacing:0.12em;line-height:1.3;text-transform:uppercase">01 / Format</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"style":{"spacing":{"margin":{"bottom":"0"}},"typography":{"fontSize":"clamp(0.9375rem, 1.1vw, 1rem)","lineHeight":"1.6"}}} -->
<p style="margin-bottom:0;font-size:clamp(0.9375rem, 1.1vw, 1rem);line-height:1.6">Core blocks. Copy, paste, done.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->

<!-- wp:group {"style":{"border":{"top":{"color":"currentColor","style":"solid","width":"1px"}},"spacing":{"blockGap":"var:preset|spacing|20","padding":{"top":"var:preset|spacing|30"}}},"layout":{"type":"constrained","contentSize":"1240px"}} -->
<div class="wp-block-group" style="border-top-color:currentColor;border-top-style:solid;border-top-width:1px;padding-top:var(--wp--preset--spacing--30)"><!-- wp:paragraph {"style":{"color":{"text":"var(--wp--preset--color--role-label, var(--wp--preset--color--contrast, var(--wp--preset--color--black)))"},"spacing":{"margin":{"bottom":"0"}},"typography":{"fontSize":"clamp(0.9375rem, 1vw, 1rem)","lineHeight":"1.3","letterSpacing":"0.12em","textTransform":"uppercase"}}} -->
<p class="has-text-color" style="color:var(--wp--preset--color--role-label, var(--wp--preset--color--contrast, var(--wp--preset--color--black)));margin-bottom:0;font-size:clamp(0.9375rem, 1vw, 1rem);letter-spacing:0.12em;line-height:1.3;text-transform:uppercase">02 / Styling</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"style":{"spacing":{"margin":{"bottom":"0"}},"typography":{"fontSize":"clamp(0.9375rem, 1.1vw, 1rem)","lineHeight":"1.6"}}} -->
<p style="margin-bottom:0;font-size:clamp(0.9375rem, 1.1vw, 1rem);line-height:1.6">Your theme’s colours and typefaces.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->

<!-- wp:group {"style":{"border":{"top":{"color":"currentColor","style":"solid","width":"1px"}},"spacing":{"blockGap":"var:preset|spacing|20","padding":{"top":"var:preset|spacing|30"}}},"layout":{"type":"constrained","contentSize":"1240px"}} -->
<div class="wp-block-group" style="border-top-color:currentColor;border-top-style:solid;border-top-width:1px;padding-top:var(--wp--preset--spacing--30)"><!-- wp:paragraph {"style":{"color":{"text":"var(--wp--preset--color--role-label, var(--wp--preset--color--contrast, var(--wp--preset--color--black)))"},"spacing":{"margin":{"bottom":"0"}},"typography":{"fontSize":"clamp(0.9375rem, 1vw, 1rem)","lineHeight":"1.3","letterSpacing":"0.12em","textTransform":"uppercase"}}} -->
<p class="has-text-color" style="color:var(--wp--preset--color--role-label, var(--wp--preset--color--contrast, var(--wp--preset--color--black)));margin-bottom:0;font-size:clamp(0.9375rem, 1vw, 1rem);letter-spacing:0.12em;line-height:1.3;text-transform:uppercase">03 / Install</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"style":{"spacing":{"margin":{"bottom":"0"}},"typography":{"fontSize":"clamp(0.9375rem, 1.1vw, 1rem)","lineHeight":"1.6"}}} -->
<p style="margin-bottom:0;font-size:clamp(0.9375rem, 1.1vw, 1rem);line-height:1.6">No plugin or build step required.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->

<!-- wp:group {"style":{"border":{"top":{"color":"currentColor","style":"solid","width":"1px"}},"spacing":{"blockGap":"var:preset|spacing|20","padding":{"top":"var:preset|spacing|30"}}},"layout":{"type":"constrained","contentSize":"1240px"}} -->
<div class="wp-block-group" style="border-top-color:currentColor;border-top-style:solid;border-top-width:1px;padding-top:var(--wp--preset--spacing--30)"><!-- wp:paragraph {"style":{"color":{"text":"var(--wp--preset--color--role-label, var(--wp--preset--color--contrast, var(--wp--preset--color--black)))"},"spacing":{"margin":{"bottom":"0"}},"typography":{"fontSize":"clamp(0.9375rem, 1vw, 1rem)","lineHeight":"1.3","letterSpacing":"0.12em","textTransform":"uppercase"}}} -->
<p class="has-text-color" style="color:var(--wp--preset--color--role-label, var(--wp--preset--color--contrast, var(--wp--preset--color--black)));margin-bottom:0;font-size:clamp(0.9375rem, 1vw, 1rem);letter-spacing:0.12em;line-height:1.3;text-transform:uppercase">04 / Licence</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"style":{"spacing":{"margin":{"bottom":"0"}},"typography":{"fontSize":"clamp(0.9375rem, 1.1vw, 1rem)","lineHeight":"1.6"}}} -->
<p style="margin-bottom:0;font-size:clamp(0.9375rem, 1.1vw, 1rem);line-height:1.6">Yours to edit and keep.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:group --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->
Variation: Folio
14,233 bytes
<!-- wp:group {"align":"full","style":{"color":{"background":"#f8f5ef","text":"#141517"},"spacing":{"padding":{"top":"clamp(3.5rem, 7vw, 6.5rem)","bottom":"clamp(3.5rem, 7vw, 6.5rem)","left":"clamp(1.25rem, 4vw, 4rem)","right":"clamp(1.25rem, 4vw, 4rem)"},"blockGap":"0"},"typography":{"fontFamily":"Helvetica Neue, Helvetica, Arial, sans-serif","fontWeight":"400"}},"layout":{"type":"constrained","contentSize":"1240px"}} -->
<div class="wp-block-group alignfull has-text-color has-background" style="color:#141517;background-color:#f8f5ef;padding-top:clamp(3.5rem, 7vw, 6.5rem);padding-right:clamp(1.25rem, 4vw, 4rem);padding-bottom:clamp(3.5rem, 7vw, 6.5rem);padding-left:clamp(1.25rem, 4vw, 4rem);font-family:Helvetica Neue, Helvetica, Arial, sans-serif;font-weight:400"><!-- wp:paragraph {"style":{"border":{"left":{"color":"#c8432b","style":"solid","width":"3px"}},"color":{"text":"#5b5f66"},"spacing":{"margin":{"top":"0","bottom":"0"},"padding":{"left":"0.75rem"}},"typography":{"fontFamily":"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace","fontSize":"0.8125rem","fontWeight":"400","letterSpacing":"0.06em","lineHeight":"1.4","textTransform":"uppercase"}}} -->
<p class="has-text-color" style="border-left-color:#c8432b;border-left-style:solid;border-left-width:3px;color:#5b5f66;padding-left:0.75rem;margin-top:0;margin-bottom:0;font-size:0.8125rem;font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;font-weight:400;letter-spacing:0.06em;line-height:1.4;text-transform:uppercase">Ada Lindqvist / About</p>
<!-- /wp:paragraph -->

<!-- wp:group {"style":{"spacing":{"margin":{"top":"1.25rem","bottom":"0"},"blockGap":"0"}},"layout":{"type":"constrained","contentSize":"80%","justifyContent":"left"}} -->
<div class="wp-block-group" style="margin-top:1.25rem;margin-bottom:0"><!-- wp:group {"style":{"color":{"background":"#141517"},"spacing":{"padding":{"top":"2px"},"blockGap":"0"}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group has-background" style="background-color:#141517;padding-top:2px"></div>
<!-- /wp:group --></div>
<!-- /wp:group -->

<!-- wp:columns {"verticalAlignment":"top","style":{"spacing":{"margin":{"top":"clamp(2rem, 4vw, 3.5rem)","bottom":"0"},"blockGap":{"top":"3rem","left":"clamp(2rem, 5vw, 5rem)"}}}} -->
<div class="wp-block-columns are-vertically-aligned-top" style="margin-top:clamp(2rem, 4vw, 3.5rem);margin-bottom:0"><!-- wp:column {"verticalAlignment":"top","width":"60%"} -->
<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:60%"><!-- wp:group {"style":{"spacing":{"blockGap":"0"}},"layout":{"type":"constrained","contentSize":"42rem","justifyContent":"left"}} -->
<div class="wp-block-group"><!-- wp:heading {"level":1,"style":{"color":{"text":"#141517"},"spacing":{"margin":{"top":"0","bottom":"0"}},"typography":{"fontFamily":"Helvetica Neue, Helvetica, Arial, sans-serif","fontSize":"clamp(2.125rem, calc(1.2rem + 3.6vw), 4rem)","fontWeight":"500","letterSpacing":"-0.02em","lineHeight":"1.04"}}} -->
<h1 class="wp-block-heading has-text-color" style="color:#141517;margin-top:0;margin-bottom:0;font-size:clamp(2.125rem, calc(1.2rem + 3.6vw), 4rem);font-family:Helvetica Neue, Helvetica, Arial, sans-serif;font-weight:500;letter-spacing:-0.02em;line-height:1.04">I photograph places, then I design what they go into.</h1>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"color":{"text":"#141517"},"spacing":{"margin":{"top":"clamp(1.5rem, 2.5vw, 2rem)","bottom":"0"}},"typography":{"fontFamily":"Helvetica Neue, Helvetica, Arial, sans-serif","fontSize":"clamp(1.0625rem, 1.3vw, 1.1875rem)","fontWeight":"400","lineHeight":"1.6"}}} -->
<p class="has-text-color" style="color:#141517;margin-top:clamp(1.5rem, 2.5vw, 2rem);margin-bottom:0;font-size:clamp(1.0625rem, 1.3vw, 1.1875rem);font-family:Helvetica Neue, Helvetica, Arial, sans-serif;font-weight:400;line-height:1.6">Seven years on my own, three before that at a Bristol design studio. I shoot buildings, rooms and objects for architects, hotels and small makers, then lay out the books, brochures and sites the pictures end up in. One pair of hands from the recce to the printer.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"style":{"color":{"text":"#5b5f66"},"spacing":{"margin":{"top":"1rem","bottom":"0"}},"typography":{"fontFamily":"Helvetica Neue, Helvetica, Arial, sans-serif","fontSize":"clamp(1.0625rem, 1.3vw, 1.1875rem)","fontWeight":"400","lineHeight":"1.6"}}} -->
<p class="has-text-color" style="color:#5b5f66;margin-top:1rem;margin-bottom:0;font-size:clamp(1.0625rem, 1.3vw, 1.1875rem);font-family:Helvetica Neue, Helvetica, Arial, sans-serif;font-weight:400;line-height:1.6">I work alone, with a retoucher I trust and a printer I can walk to.</p>
<!-- /wp:paragraph -->

<!-- wp:buttons {"style":{"spacing":{"margin":{"top":"clamp(2rem, 3vw, 2.5rem)","bottom":"0"},"blockGap":{"top":"0.5rem","left":"1.5rem"}}},"layout":{"type":"flex","justifyContent":"left","verticalAlignment":"center"}} -->
<div class="wp-block-buttons" style="margin-top:clamp(2rem, 3vw, 2.5rem);margin-bottom:0"><!-- wp:button {"url":"/contact/","style":{"border":{"radius":"0px"},"color":{"background":"#141517","text":"#efe9df"},"spacing":{"padding":{"top":"0.875rem","bottom":"0.875rem","left":"1.375rem","right":"1.375rem"}},"typography":{"fontFamily":"Helvetica Neue, Helvetica, Arial, sans-serif","fontWeight":"500","letterSpacing":"0"}}} -->
<div class="wp-block-button"><a class="wp-block-button__link has-text-color has-background wp-element-button" href="/contact/" style="border-radius:0px;color:#efe9df;background-color:#141517;padding-top:0.875rem;padding-right:1.375rem;padding-bottom:0.875rem;padding-left:1.375rem;font-family:Helvetica Neue, Helvetica, Arial, sans-serif;font-weight:500;letter-spacing:0">Book a day</a></div>
<!-- /wp:button -->

<!-- wp:button {"url":"/work/","style":{"border":{"radius":"0px"},"color":{"background":"transparent","text":"#141517"},"spacing":{"padding":{"top":"0.875rem","bottom":"0.875rem","left":"0","right":"0.875rem"}},"typography":{"fontFamily":"Helvetica Neue, Helvetica, Arial, sans-serif","fontSize":"1rem","fontWeight":"400","textDecoration":"underline"}}} -->
<div class="wp-block-button"><a class="wp-block-button__link has-text-color has-background has-custom-font-size wp-element-button" href="/work/" style="border-radius:0px;color:#141517;background-color:transparent;padding-top:0.875rem;padding-right:0.875rem;padding-bottom:0.875rem;padding-left:0;font-size:1rem;font-family:Helvetica Neue, Helvetica, Arial, sans-serif;font-weight:400;text-decoration:underline">See the work</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons --></div>
<!-- /wp:group --></div>
<!-- /wp:column -->

<!-- wp:column {"verticalAlignment":"top","width":"36%"} -->
<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:36%"><!-- wp:image {"aspectRatio":"4/5","scale":"cover","sizeSlug":"large","linkDestination":"none","style":{"spacing":{"margin":{"top":"0","bottom":"0"}}}} -->
<figure class="wp-block-image size-large" style="margin-top:0;margin-bottom:0"><img src="https://patternpaste.com/previews/_assets/portrait-03.jpg" alt="Studio portrait of a woman in their 30s with straight dark shoulder-length hair with centre part, wearing an olive blouse, against a warm grey background." style="aspect-ratio:4/5;object-fit:cover"/></figure>
<!-- /wp:image -->

<!-- wp:paragraph {"style":{"color":{"text":"#5b5f66"},"spacing":{"margin":{"top":"0.75rem","bottom":"0"}},"typography":{"fontFamily":"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace","fontSize":"0.8125rem","fontWeight":"400","letterSpacing":"0.06em","lineHeight":"1.45","textTransform":"uppercase"}}} -->
<p class="has-text-color" style="color:#5b5f66;margin-top:0.75rem;margin-bottom:0;font-size:0.8125rem;font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;font-weight:400;letter-spacing:0.06em;line-height:1.45;text-transform:uppercase">FR 00 / Spike Island, 2026</p>
<!-- /wp:paragraph -->

<!-- wp:group {"style":{"border":{"top":{"color":"#141517","style":"solid","width":"1px"}},"spacing":{"margin":{"top":"1.75rem","bottom":"0"},"padding":{"top":"0.875rem"},"blockGap":"0"}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group" style="border-top-color:#141517;border-top-style:solid;border-top-width:1px;padding-top:0.875rem;margin-top:1.75rem;margin-bottom:0"><!-- wp:group {"style":{"spacing":{"padding":{"top":"0","bottom":"0.875rem"},"blockGap":"0.25rem"}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group" style="padding-top:0;padding-bottom:0.875rem"><!-- wp:paragraph {"style":{"color":{"text":"#5b5f66"},"spacing":{"margin":{"top":"0","bottom":"0"}},"typography":{"fontFamily":"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace","fontSize":"0.8125rem","fontWeight":"400","letterSpacing":"0.06em","lineHeight":"1.45","textTransform":"uppercase"}}} -->
<p class="has-text-color" style="color:#5b5f66;margin-top:0;margin-bottom:0;font-size:0.8125rem;font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;font-weight:400;letter-spacing:0.06em;line-height:1.45;text-transform:uppercase">01 / Based</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"style":{"color":{"text":"#141517"},"spacing":{"margin":{"top":"0.25rem","bottom":"0"}},"typography":{"fontFamily":"Helvetica Neue, Helvetica, Arial, sans-serif","fontSize":"1rem","fontWeight":"400","lineHeight":"1.6"}}} -->
<p class="has-text-color" style="color:#141517;margin-top:0.25rem;margin-bottom:0;font-size:1rem;font-family:Helvetica Neue, Helvetica, Arial, sans-serif;font-weight:400;line-height:1.6">Spike Island Studios, Bristol</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->

<!-- wp:group {"style":{"border":{"top":{"color":"#5b5f66","style":"solid","width":"1px"}},"spacing":{"padding":{"top":"0.875rem","bottom":"0.875rem"},"blockGap":"0.25rem"}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group" style="border-top-color:#5b5f66;border-top-style:solid;border-top-width:1px;padding-top:0.875rem;padding-bottom:0.875rem"><!-- wp:paragraph {"style":{"color":{"text":"#5b5f66"},"spacing":{"margin":{"top":"0","bottom":"0"}},"typography":{"fontFamily":"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace","fontSize":"0.8125rem","fontWeight":"400","letterSpacing":"0.06em","lineHeight":"1.45","textTransform":"uppercase"}}} -->
<p class="has-text-color" style="color:#5b5f66;margin-top:0;margin-bottom:0;font-size:0.8125rem;font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;font-weight:400;letter-spacing:0.06em;line-height:1.45;text-transform:uppercase">02 / Shoots</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"style":{"color":{"text":"#141517"},"spacing":{"margin":{"top":"0.25rem","bottom":"0"}},"typography":{"fontFamily":"Helvetica Neue, Helvetica, Arial, sans-serif","fontSize":"1rem","fontWeight":"400","lineHeight":"1.6"}}} -->
<p class="has-text-color" style="color:#141517;margin-top:0.25rem;margin-bottom:0;font-size:1rem;font-family:Helvetica Neue, Helvetica, Arial, sans-serif;font-weight:400;line-height:1.6">Architects, hotels and makers</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->

<!-- wp:group {"style":{"border":{"top":{"color":"#5b5f66","style":"solid","width":"1px"}},"spacing":{"padding":{"top":"0.875rem","bottom":"0.875rem"},"blockGap":"0.25rem"}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group" style="border-top-color:#5b5f66;border-top-style:solid;border-top-width:1px;padding-top:0.875rem;padding-bottom:0.875rem"><!-- wp:paragraph {"style":{"color":{"text":"#5b5f66"},"spacing":{"margin":{"top":"0","bottom":"0"}},"typography":{"fontFamily":"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace","fontSize":"0.8125rem","fontWeight":"400","letterSpacing":"0.06em","lineHeight":"1.45","textTransform":"uppercase"}}} -->
<p class="has-text-color" style="color:#5b5f66;margin-top:0;margin-bottom:0;font-size:0.8125rem;font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;font-weight:400;letter-spacing:0.06em;line-height:1.45;text-transform:uppercase">03 / Designs</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"style":{"color":{"text":"#141517"},"spacing":{"margin":{"top":"0.25rem","bottom":"0"}},"typography":{"fontFamily":"Helvetica Neue, Helvetica, Arial, sans-serif","fontSize":"1rem","fontWeight":"400","lineHeight":"1.6"}}} -->
<p class="has-text-color" style="color:#141517;margin-top:0.25rem;margin-bottom:0;font-size:1rem;font-family:Helvetica Neue, Helvetica, Arial, sans-serif;font-weight:400;line-height:1.6">Books, brochures and websites</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->

<!-- wp:group {"style":{"border":{"top":{"color":"#5b5f66","style":"solid","width":"1px"}},"spacing":{"padding":{"top":"0.875rem","bottom":"0.875rem"},"blockGap":"0.25rem"}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group" style="border-top-color:#5b5f66;border-top-style:solid;border-top-width:1px;padding-top:0.875rem;padding-bottom:0.875rem"><!-- wp:paragraph {"style":{"color":{"text":"#5b5f66"},"spacing":{"margin":{"top":"0","bottom":"0"}},"typography":{"fontFamily":"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace","fontSize":"0.8125rem","fontWeight":"400","letterSpacing":"0.06em","lineHeight":"1.45","textTransform":"uppercase"}}} -->
<p class="has-text-color" style="color:#5b5f66;margin-top:0;margin-bottom:0;font-size:0.8125rem;font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;font-weight:400;letter-spacing:0.06em;line-height:1.45;text-transform:uppercase">04 / Prints with</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"style":{"color":{"text":"#141517"},"spacing":{"margin":{"top":"0.25rem","bottom":"0"}},"typography":{"fontFamily":"Helvetica Neue, Helvetica, Arial, sans-serif","fontSize":"1rem","fontWeight":"400","lineHeight":"1.6"}}} -->
<p class="has-text-color" style="color:#141517;margin-top:0.25rem;margin-bottom:0;font-size:1rem;font-family:Helvetica Neue, Helvetica, Arial, sans-serif;font-weight:400;line-height:1.6">Pressworks, St Philips</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:group --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->
Back to Core Patterns