# Gift voucher ticket

> A gift voucher drawn as a ticket: one card split by a dashed perforation into a stub carrying the value and a body saying what it buys and how to get one, with one button. Stub and body stay side by side at every width. States no colour and no font of its own.

Canonical: https://patternpaste.com/pattern/gift-voucher-ticket.html
Section: Call to action
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, paragraph
Keywords: gift voucher, gift card, café, present, ticket, buy

## Variations (2)

### Ticket (the default)

Identical markup in every theme.

A role-plate card with a contrast outline and a dashed contrast perforation, the value in your text colour, your theme’s button.

### Crumb

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

The Crumb café set: a milk ticket rounded at 14px on an oat hairline, a dashed cocoa perforation, the value in terracotta Georgia and an espresso pill.


---

## The signature moment: a gift voucher as a ticket: a card with a dashed perforation line splitting a stub (value) from the body (what it buys, how to get one), one button

**One card, torn in two by a dashed perforation.** The stub carries the
value at display size; the body says what it buys and how to get one, with
one button. The perforation is the body column's dashed left border, so it
runs the ticket's full height, and the two columns do not stack on a phone,
so the ticket stays a ticket at every width.

## What it inherits from your theme

- **Typeface.** The base states no font family.
- **Palette.** The ticket tries `role-plate` and `role-plate-text`, outlined
  and perforated in `contrast`; the label tries `role-label`.
- **Buttons.** Your theme's button with a stated padding.

## What it decides for itself

- **The value.** Off the ladder on purpose: `clamp(2.25rem, 7vw, 5rem)`.
- **The heading.** The `x-large` rung.

## What to change first

1. **The value.** Your usual amount.
2. **What it buys.** Your menu, in a line.
3. **The link.** `#gift-voucher`.

## 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, 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.