Skip to main content
The stats-band section renders a horizontal strip of stat items, each combining an icon, a bold numeric or short value, and a descriptive label. It is designed to communicate impact at a glance — think “8 essays published”, “6 topics”, “14 post-to-tag links”. Use stats-band after an introductory section (such as hero or content-block) to anchor abstract claims with concrete numbers. It works equally well on marketing pages and technical demo pages.

​
Data fields

​
string
An eyebrow label rendered above the section title — for example "The journal in numbers". Optional.
​
string
The section heading — for example "Small, deliberate, linked". Optional. Omit it when the stat items are self-explanatory and you want a more minimal, data-focused layout.
​
StatSchema[]
required
An ordered array of stat objects. Each item renders as one stat cell in the band. Include between two and six items for the best layout across screen sizes.Each stat object has the following fields:
​
string
required
A unique identifier for this stat — for example "stat-posts". Used as the React key. Keep it stable across edits.
​
string
The name of a Lucide React icon to render alongside the stat value — for example "pen-line", "tag", "sparkles", or "users". Optional. Pass the kebab-case icon name exactly as listed in the Lucide icon directory.
​
string
required
The primary metric displayed in large type — typically a number ("8", "14") but can be any short string ("99%", "< 1 ms"). Keep it short: one to six characters renders best.
​
string
required
A short description that explains what the value measures — for example "Essays published, each in a posts collection entry". One sentence or phrase.
Browse the full Lucide icon set at lucide.dev/icons. Use the kebab-case name shown under each icon — for example the icon named “Pen Line” is passed as "pen-line".

​
Settings fields

​
"none" | "sm" | "md" | "lg" | "xl"
Vertical padding applied above the section.
​
"none" | "sm" | "md" | "lg" | "xl"
Vertical padding applied below the section.

​
JSON example

The following example is taken from home.json:

​
Used on pages

stats-band is a supporting section used to add quantified credibility after introductory copy: Place stats-band in the middle of a page, between narrative and conversion sections — it rarely works as a first or last section.