# Availability calendar

> The next six months at a glance, as a wall planner of month tiles: each tile gives the year, the month at display size and a status with a small square mark. An open month carries a heavy top rule and a filled mark, a nearly full one a heavy rule and names the days left, and a booked month is struck through with an empty mark. A short line on how dates are held and one underlined link sit beside the heading. States no colour and no font of its own.

Canonical: https://patternpaste.com/pattern/availability-calendar.html
Section: Timeline
Access: Free, and free to keep.
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: availability, calendar, diary, booking, freelance, dates, months

## Variations (2)

### Wall planner (the default)

Identical markup in every theme.

Your base ground and contrast text, tiles in role-rule hairlines with a contrast rule on the months still open, booked months struck through, an underlined Hold a date link.

### Folio

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

The Folio set’s diary on bone: six month tiles in graphite hairlines, a safelight rule and square on the open month, darkroom on the nearly full ones, booked months struck through in graphite, years and statuses in mono.


---

## The signature moment: the diary reads at a glance, open months ruled heavy and booked months struck through

**The status is drawn, not only written.** Every tile gives the year, the
month at display size and a status beside a small square mark: an open month
has a heavy top rule and a filled square, a nearly full month a heavy rule and
names the days left, and a booked month keeps a hairline, an empty square and
its name struck through. A line on how dates are held and one underlined link
sit beside the heading.

## What it inherits from your theme

- **Typeface.** The base states no font family.
- **Palette.** Your `base` ground and `contrast` text. The tile hairlines and
  the empty squares try `role-rule`, the heavy rules and filled squares are
  `contrast`, the label tries `role-label`; all fall back to `base` and
  `contrast`.
- **Link.** An underlined text link in the text colour, padded to a 44px
  target.

## What it decides for itself

- **The grid.** 19rem minimum columns and six tiles: three across from about
  1000px, two on a tablet, one on a phone, so every row is full at every
  width. Keep the count at six, or at a multiple of six, if you edit it.
- **The month names.** Off the ladder: a bare `clamp()` from 2rem to 2.625rem,
  since the months are what the eye scans. The heading is on the ladder at
  `x-large`.
- **The struck month** is a paragraph with a line-through, so the month stays
  readable and the strike is the status.

## What to change first

1. **The six months**: the year, the month and its status. Move the heavy top
   rule and the filled square to the months you still have.
2. **Each tile's line**: the free days, or what the month is booked for.
3. **The holding line and the link** (it points at `/contact/`).

## The Folio look

Part of the Folio Pattern Set, a freelance photographer and designer's whole
site in one design language: a bone ground `#efe9df`, graphite `#5b5f66`
hairlines and secondary copy, darkroom `#141517` ink; the open month is a
paper tile `#f8f5ef` under a safelight `#c8432b` rule with a safelight
square, nearly full months carry a darkroom rule and square, and booked
months are struck through in graphite. Months and the heading are Helvetica
Neue at 500 (Helvetica, Arial, sans-serif); years and statuses are monospace
(ui-monospace, SFMono-Regular, Menlo, Consolas, monospace), uppercase and
tracked, like a contact sheet's frame numbers. Corners are square; the link is
underlined darkroom. Safelight is used only for rules and marks, never for
small text. 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.
