[Library] Stats

Stats

Numbers that carry the argument, set at the size they deserve. 10 patterns, 13 variations between them: every variation is its own copy-paste file, one click from its pattern.

Thumbnails on this page are rendered in Twenty Twenty-Five. Your theme is applied to every live preview, on a pattern's own page.

10patterns
23designs
How it behaves

10 patterns

Stat callout rendered in Twenty Twenty-FiveThumbnail in Twenty Twenty-Five StatsStandard

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.

5 blocks · core only · 1 variation Preview Night plaque
Stat comparison rendered in Twenty Twenty-FiveThumbnail in Twenty Twenty-Five StatsStandard

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

5 blocks · core only · 1 variation Preview Night comparison
Stat matrix rendered in Twenty Twenty-FiveThumbnail in Twenty Twenty-Five StatsStandard

Stat matrix

An asymmetric bento matrix: one expansive double-height marquee cell on the left detailing a primary productivity metric, flanked by two stacked secondary stat cells on the right, all framed in 1px currentColor borders. States no colour and no font of its own.

5 blocks · core only · 2 variations Preview Matrix reversedNight matrix
Stat monument rendered in Twenty Twenty-FiveThumbnail in Twenty Twenty-Five StatsStandard

Stat monument

A monumental scale hierarchy: one colossal figure dominates the left flank at display size, paired with an orientation heading and thesis paragraph on the right, anchored by a ruled three-column shelf of subsidiary proof metrics below. States no colour and no font of its own.

6 blocks · core only · 1 variation Preview Night monument
Stat pillars rendered in Twenty Twenty-FiveThumbnail in Twenty Twenty-Five StatsStandard

Stat pillars

Three monolithic architectural pillars in 1px currentColor outline frames: each pillar carries a tracked index eyebrow, a figure at display scale, a dividing hairline, a bold metric label, and a full paragraph of empirical context. Anchored by a methodology footnote. States no colour and no font of its own.

5 blocks · core only · 1 variation Preview Night pillars
Stat quadrant rendered in Twenty Twenty-FiveThumbnail in Twenty Twenty-Five StatsStandard

Stat quadrant

Four figures in a 2x2 inside a 1px currentColor plate, one hairline running the full width between the rows and one running the full height between the columns, both meeting the frame so the four figures sit in four panes of a window. Each pane is a tracked label, the figure at display size with its unit small beside it, and a caption of four or five words. The quadrant holds on a phone rather than stacking, so the window never becomes a list. States no colour and no font of its own.

5 blocks · core only · 1 variation Preview Night plate
Stat row rendered in Twenty Twenty-FiveThumbnail in Twenty Twenty-Five StatsSignatureStandard

Stat row

Four key figures across one tonal band, each set at display size with its unit small and tight beside it, every figure locked to a single baseline and sitting on a hairline that makes that baseline visible. States no colour and no font of its own.

6 blocks · core only · 2 variations Preview Ledger paperNight band
Stat split rendered in Twenty Twenty-FiveThumbnail in Twenty Twenty-Five StatsStandard

Stat split

An asymmetric editorial split: a narrative anchor column on the left with eyebrow, display heading, contextual paragraph and action button, set against a stacked four-row data ledger on the right with full-width currentColor hairlines. States no colour and no font of its own.

7 blocks · core only · 2 variations Preview Night splitSeam reversed
Stat stack rendered in Twenty Twenty-FiveThumbnail in Twenty Twenty-Five StatsStandard

Stat stack

Five figures read down instead of across: each one is a full-width ruled row with a wide-tracked label and a line of basis on the left, and the figure set at display size and flush right, so the figures line up into one hard vertical edge down the whole section. The right alignment is set on the type rather than on the layout, so the edge survives the phone. States no colour and no font of its own.

5 blocks · core only · 1 variation Preview Night stack
Stat ticker rendered in Twenty Twenty-FiveThumbnail in Twenty Twenty-Five StatsStandard

Stat ticker

A high-density horizontal data ribbon framed by top and bottom hairlines, dividing four key metrics with vertical currentColor hairlines. Designed to sit flush under a hero or between content sections for rapid empirical validation. States no colour and no font of its own.

4 blocks · core only · 1 variation Preview Night ticker
No patterns matchClear a filter to see all 10 patterns.

All sections