# Menu dish anatomy

> One signature dish photographed in the middle, its four parts labelled around it: each label a name and a short line on a hairline leader that runs to the photograph, two on each side, then the price and a link. Built from columns, no positioning. Example image included and replaceable in the editor. States no colour and no font of its own.

Canonical: https://patternpaste.com/pattern/menu-dish-anatomy.html
Section: Features
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, heading, image, paragraph
Keywords: menu, signature dish, croissant, bakery, ingredients, café

## Variations (2)

### Labelled dish (the default)

Identical markup in every theme.

Role-rule leaders, role-label names, your text colour elsewhere, an underlined link.

### Crumb

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

The Crumb café set: terracotta leaders and labels on oat, a photograph rounded at 14px, espresso Georgia heading and an underlined link.


---

## The signature moment: one signature dish photographed, its parts labelled around it (flour, butter, the fold, the bake), each label a short line with a hairline leader; no absolute positioning, build it from a grid or columns around the photo

**The dish is the diagram.** The photograph takes the middle column and
the four parts sit two on each side, each a name and a short line on a
hairline leader. The leader is the label's bottom border, and the label is
padded on the side away from the photograph, so the rule runs right up to
its edge; the right-hand labels sit lower than the left. Three columns and no
positioning: on a phone the labels stack above and below the photograph.

## What it inherits from your theme

- **Typeface.** The base states no font family.
- **Palette.** Your `base` ground and `contrast` text; the names try
  `role-label` and the leaders `role-rule`.
- **Links.** An underlined text link.

## What it decides for itself

- **The heading.** The `x-large` rung.
- **The photograph.** A 4:5 crop in the middle 44%.

## What to change first

1. **The photograph.** Your own signature dish, shot from above or the side.
2. **The parts.** Four names and four short lines.
3. **The link.** `#menu`.

## 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, image, heading, paragraph, 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.
