Date in figures: WordPress Block Pattern, Pattern Paste Canonical: https://patternpaste.com/pattern/date-in-figures.html Core Patterns (https://patternpaste.com/patterns/) Stats (https://patternpaste.com/patterns/stats/) Catalogue access Standard # Date in figures One date made the headline: a dark slab with a small label and heading over the day, month and year as three equal figures at monumental size, each with a small word beneath and a hairline between them, then one line of place and an Add to your calendar button. The three figures stay side by side on a phone. ## All patterns Search patterns Loading patterns… Start here ## What to change first - The figures and their words. - The calendar link. It is a Google Calendar template URL with the date, time and place in it; edit its text, dates and location, or upload an .ics file to your Media Library and link to that instead. - The place line. The signature moment ## The date is the headline, split into three ruled figures Three flex cells that never wrap, each selfStretch: fill, so the figures share the width equally at every size, 19, 06 and 27, with a hairline down the left edge of the second and third cells. The cells carry no padding of their own (the padding is on the group inside), so the rules run the full height of the row. On a phone the figures stay three across at about 72px, with their words at 14px. Theme handoff ## What comes from where ### From your theme - Typeface. - Palette. ### Set by this pattern - The figures. - The heading. Full pattern notes ## Why it works, and how it is built Open a topic for the complete design reasoning, editing guidance and implementation notes. Design rationaleComposition, intent and nearest alternatives ### Overview A save-the-date section where the date itself is the headline. A dark slab carries a small label and heading, then the day, month and year as three equal figures at monumental size, each with a small word beneath it, then one line of place and an Add to your calendar button. It sits in the stats section beside stat-monument (one figure at scale), stat-row (metrics on a baseline), events-date-tiles (many calendar leaves) and specials-today-band (today as a text band): none splits one date into its three parts. ### The signature moment: the date is the headline, split into three ruled figures Three flex cells that never wrap, each selfStretch: fill, so the figures share the width equally at every size, 19, 06 and 27, with a hairline down the left edge of the second and third cells. The cells carry no padding of their own (the padding is on the group inside), so the rules run the full height of the row. On a phone the figures stay three across at about 72px, with their words at 14px. Make it yoursVariations and the edits to make first ### What to change first - The figures and their words. - The calendar link. It is a Google Calendar template URL with the date, time and place in it; edit its text, dates and location, or upload an .ics file to your Media Library and link to that instead. - The place line. Theme behaviourInheritance, fixed decisions and contrast ### What it inherits from your theme - Typeface. The base states no font family. - Palette. An inverted slab: your contrast colour as the ground, your base colour for every word and figure, currentColor rules. Labels on the slab start at base, never a ground role. The button inverts back to a base fill with contrast type, so it still reads as the lit thing. ### What it decides for itself - The figures. clamp(4.5rem, 1rem + 14vw, 12rem): about 72px on a phone, 192px on a laptop. Off the ladder, because their size is the composition. - The heading. The x-large rung, italic. Technical notesBlock mechanics, responsive behaviour and constraints ### The Vow look Part of the Vow Pattern Set, a couple's whole wedding website in one design language: wisteria white #f7f5fb ground, midnight #1f2240 ink, dusk #555a78 muted ink, card white #ffffff on a wisteria hairline #d9d3e6, peony #a8365a labels on light grounds and pale peony #f2b8c9 on the midnight slab. Names and headings are Didot at 400 with an italic ampersand; body, labels and buttons are Gill Sans. Buttons are square midnight rectangles or underlined peony links; cards and photographs are square. 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, heading, paragraph, buttons, button. No countdown, no script. Questions ## Date in figures: common questions Does Date in figures need a plugin? No. It is built only from core WordPress blocks (button, buttons, group, heading and paragraph), so it pastes into the block editor with nothing to install. Will Date in figures match my theme? Choose by variation. Dark slab takes your theme’s palette; Vow brings its own colours. How many variations does Date in figures have? 2: Dark slab and Vow. Each is its own markup; choose one in the toolbar above the preview before you copy. Is Date in figures free? It is included with a subscription, with every Core Pattern and variation. 62 Core Patterns are free to copy without one. Which WordPress version does it need? 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. 9.4KB of core-block markup, 5 blocks (button, buttons, group, heading, paragraph), and nothing else: paste it into the block editor and it becomes editable blocks wearing your theme. Subscribe to copy it, £119 a year (https://patternpaste.com/account/#plan) What you copy is yours forever. Not for you? We refund within 14 days. Back to Core Patterns (https://patternpaste.com/patterns/) Catalogue access ### £119 a year All patterns, variations and theme downloads. What you copy is yours forever. Not for you? We refund within 14 days. Subscribe, £119 a year (https://patternpaste.com/account/#plan) Sign in (https://patternpaste.com/account/) Everything you copy is yours to keep, forever, on any site; access to the rest of the library runs while you subscribe. Not for you? Tell us within 14 days of a payment and we refund you. After that, cancelling stops the next renewal and access runs to the end of the year you have paid for. Prices are in pounds and are the full price in the UK, the US and eleven other countries; elsewhere the checkout adds your local VAT or sales tax. The terms name every country. #### Pair with Hero Hero aperture An opening section on your theme's own paper: a tracked line, a display headline, one short paragraph on a reading measure, and then a picture that stops short of the edge on every side. The signature is the margin: the image is a window cut in the page rather than a band across it, and the paper around it is what you notice. A small opaque plate in the picture's bottom-right corner carries the caption, so no type ever sits on the photograph. The still-image version includes an example photograph; select your own clip for the video version. States no colour and no font of its own. (https://patternpaste.com/pattern/hero-aperture.html)Features Appointment letter checklist What to bring to a first appointment, set as the confirmation letter itself: a card with the booking's details written into ruled blanks (date, time, who, where, length and fee) and a checklist of empty squares to tick the night before, beside a short introduction. States no colour and no font of its own. (https://patternpaste.com/pattern/appointment-letter-checklist.html)Testimonials Quote wall Eight short testimonials at reading size in three columns of unequal width, three, two and three, each quote hanging under a currentColor hairline with a small portrait and its name tracked beneath it, eight distinct faces. The rules line up once across the top of the wall and never again, so the section reads as a mass of voices rather than as a row of cards. States no colour and no font of its own. (https://patternpaste.com/pattern/quote-wall.html) #### Before you paste 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. How we test patterns (https://patternpaste.com/how-we-test/) ## Specifications Section Stats Access Subscription Plugin None, core blocks only Variations 2 Colour From your theme or its own palette Type From your theme or its own type Motion None Blocks button, buttons, group, heading, paragraph Presets color 4, font-size 2, spacing 3 WordPress 7.0+ Continue exploring ## Next in Stats Explore all 13 Stats patterns (https://patternpaste.com/patterns/stats/)Also in Hero (https://patternpaste.com/patterns/hero/) Shot in Twenty Twenty-Five Stats No plugin needed ### Arisings recycled figures A figures section on an inverted slab where one number carries it: a percentage set at display size over a heading that finishes the sentence and a short note, beside a tall photograph. Stats Preview pattern (https://patternpaste.com/pattern/arisings-recycled-figures.html) Shot in Twenty Twenty-Five Stats No plugin needed ### Stat callout A high-impact framed spotlight plaque: a central marquee figure and bold executive statement sit above a ruled three-part corroboration shelf enclosed within the same 1px currentColor architectural frame. Stats Preview pattern (https://patternpaste.com/pattern/stat-callout.html) Shot in Twenty Twenty-Five Stats No plugin needed ### Stat comparison A side-by-side comparative delta matrix: two balanced 1px currentColor panels contrast industry standard baseline metrics directly against platform outcomes across setup time, availability, and response latency. Stats Preview pattern (https://patternpaste.com/pattern/stat-comparison.html)