# CTA book appointment

> A booking band for a clinic or a salon where the next free slot is the headline. A tracked label introduces the next available appointment set at display size, a line on who it is with, a Book online button and a reassurance line on cancelling; beside it a ruled box says or call reception, with the number as a large tap-to-call link and the phone hours beneath. States no colour and no font of its own.

Canonical: https://patternpaste.com/pattern/cta-book-appointment.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: book, appointment, booking, clinic, salon, call, next available

## Variations (2)

### Book appointment (the default)

Identical markup in every theme.

Your base ground with your contrast type, your theme's own button, and the call box ruled in your rule colour.

### Pearl and rosewood

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

A clinic or salon look: a pearl ground, a white call card, near-black type and a rosewood pill button and number, with Georgia display over Helvetica.


---

## The signature moment: the next free slot is the headline

**The heading is not "Book now"; it is a date and a time.** "Tuesday 14
October, 9.40am" at `clamp(2.5rem, 5.2vw, 4.75rem)` answers the question a
visitor actually has, when can I be seen, before it asks them to act. The
call box is the counterweight: a smaller, boxed second route at 40 per cent.
It survives colourlessness because it is scale and a box, not colour.

## What it inherits from your theme

- The ground is `base` and every line of type is `contrast`, each a two-rung
  chain. Text is at 4.5:1 or better in the stock themes.
- The labels start on `role-label`, the box rule on `role-rule`, the number
  on `role-link`; all fall through to `contrast`.
- Book online is your theme's own button: it states no colour, only 0.875rem
  of padding above and below so it clears 44px in every stock theme.
- The heading is off the type ladder on purpose, a bare clamp: the slot is the
  composition. Body copy takes `medium`.
- The typeface is your theme's.

## What it decides for itself

- The columns are 60 and 40 per cent, centred on each other, and stack below
  782px with the slot first.
- The number is a transparent `core/button` with `tel:` behind it, never a bare
  anchor.

## The Styled look

`pearl-and-rosewood` states a pearl ground `#f8f3f0`, near-black type
`#2b2226` (14:1), a white call card, and a rosewood `#8b3a50` pill button with
pearl text (6.8:1) and a rosewood number. The heading and the number are
Georgia, the rest Helvetica. It is for a clinic, a dental practice or a salon.

## What to change first

The date, time and practitioner (keep them current, or say "this week"), the
Book online link, the phone number and its `tel:` link, and the phone hours.
