[Library] Stats

Catalogue accessStandard

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. States no colour and no font of its own.

Variation View
Before you copy

Identical markup in every theme. Manrope typeface rgb(255, 255, 255) ground 1280px viewport

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.

The signature moment

Architectural spotlight plaque

The entire argument is contained inside one authoritative plaque. At the top, an asymmetric split pits an immense marquee metric (10x) directly against a commanding executive headline. Below, an internal currentColor hairline opens onto a three-column corroboration shelf supplying the empirical proof (QA reduction, annual cost savings, time to rollout).

What it inherits from your theme

  • Typeface. No font family is stated anywhere.
  • Palette. Ground and text resolve to base and contrast chains.
  • Spacing scale. Uses core spacing presets for margins and padding.

What it decides for itself

  • The unified spotlight plaque architecture.
  • The marquee-to-shelf vertical hierarchy.
  • The typographic display ramp.

What you change first

  1. The marquee figure and executive statement.
  2. The three supporting shelf statistics and descriptions.
Why this is not the other stats patterns44 words
  • stat-monument spans the full width of an unboxed section.
  • stat-quadrant divides four figures into a 2x2 grid.
  • stat-pillars uses three separate standalone columnar boxes.
  • stat-callout houses both the marquee statement and the supporting shelf inside a single unified architectural plaque.
Mechanics worth knowing54 words
  • Self-contained plaque frame. The 1px currentColor border encloses both upper headline and lower shelf into a unified visual unit.
  • Shelf divider. An internal group with border-top: 1px solid currentColor creates a clean horizontal rule across the plaque.
  • Explicit text colours. Stated on all elements to ensure contrast integrity across all themes.
The variations21 words
  • Night plaque. The plaque itself inverts to your contrast ground with base text, sitting cleanly within an unchanged base-ground page.
Contrast27 words

All text and figures are contrast on base (or base on contrast in Night plaque). Display figures meet 3:1 criteria; all labels and body copy meet 4.5:1.

Display type24 words

Off the theme's ladder on purpose, because the size is the composition:

  • paragraph at clamp(3.75rem, 8.5vw, 6.5rem)
  • paragraph at clamp(2rem, 3.5vw, 2.75rem)
Back to the library