# About pull quote photo

> A founder’s story led by a large pull quote on a plate that laps up over an offset pair of photographs, a tall one and a shorter one dropped lower, with a signed attribution, a short paragraph and a text link. Example images included and replaceable in the editor. States no colour and no font of its own.

Canonical: https://patternpaste.com/pattern/about-pull-quote-photo.html
Section: Team
Access: Included in Pattern Paste access.
Needs: Requires a block theme on WordPress 7.0. 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: button, buttons, column, columns, group, image, paragraph
Keywords: about, story, founder, quote, photographs, small business

## Variations (2)

### Quote over the pair (the default)

Identical markup in every theme.

Your base ground and contrast text, the quote plate in role-plate falling back to base with a contrast hairline, an underlined text link.

### Crumb

This variation states its own colours and states its own type: identical in every theme.

The Crumb café set: oat ground, the quote in espresso Georgia on a milk card with an oat hairline, a terracotta signature and an underlined link, over two rounded photographs.


---

## The signature moment: the founder's quote laps the photographs

**The quote plate rides up over the bottom of an offset photo pair, so the
founder's sentence reads as the caption to both pictures at once.** The pair
is two columns that never stack, the second photograph dropped by a
`clamp()` top padding; the plate is the second child of a vertical flex
group with a negative top margin, so it paints over the photographs and the
lap never collapses. On a phone the lap shrinks to 1.5rem.

## What it inherits from your theme

- **Typeface.** The base states no font family.
- **Palette.** Your `base` ground and `contrast` text. The plate tries
  `role-plate` and `role-plate-text` with a `role-rule` hairline, falling back
  to `base`, `contrast` and `contrast`; the label tries `role-label`.
- **Link.** A transparent, underlined core button in the text colour.

## What it decides for itself

- **The quote.** Off the ladder on purpose: `clamp(1.625rem, 3vw, 2.5rem)`,
  a paragraph rather than a heading, so its size is its hierarchy.
- **The plate.** Capped at 46rem and set to the right.

## What to change first

1. **The quote and signature.** Type your own words and name.
2. **The photographs.** Select each and choose **Replace**.
3. **The link.** `#team`.

## The Crumb look

Part of the Crumb Pattern Set, one café's whole site in one design language:
oat ground `#f4ecdf`, espresso ink `#2b1d16`, muted cocoa `#5c4a3f`, milk
cards `#fbf7f0` on oat hairlines `#dccfbf`, terracotta `#b3462d` labels and
peach `#e8a27c` on the espresso slab. Headings are Georgia at 400, body,
labels and buttons Helvetica; buttons are espresso pills or underlined links,
cards and photographs rounded at 14px. Every text pair is measured on the
ground it is painted on. Take the base for your theme's colours, or the
look's **Use my theme** chip.

## Notes

- Core blocks only: group, columns, column, paragraph, image, buttons, button. No plugin, nothing to keep updated.
- The root group sets headings and links to `currentColor`, so every heading,
  paragraph and link inherits the group's text colour in any theme; only
  role-bearing text (labels, rules, plates) carries its own chain.

## Included images

The copied markup includes WordPress Photo Directory example photographs. The public image URLs
keep the examples visible after pasting. Select an image 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.
