Search blocks by description or jump to a page.
Paired figures with labels that weigh your offering against a baseline. Great for sales pages that need to make the gain feel concrete and credible.
Comparison Stats is a two-column layout with a sticky sidebar on the left and a two-by-two card grid on the right. The sidebar holds a period badge, a heading, a short description, and a footnote line showing when the data was last refreshed. Each card in the grid displays a metric title, a pill-shaped percentage badge with a chevron arrow, the current figure as a large bold number, a trending icon paired with the previous period value, and a timeframe label below.
The sidebar copy, badge text, and footnote are all independent of the cards, so you can update the period label or description without touching the metrics. The cards themselves are driven by a data array, so you can add, remove, or reorder metrics freely. The color logic on each badge is aware of direction context: a falling refund rate is shown in green, not red, so you can apply the same pattern to any metric where a decrease is a positive outcome.
Reach for this block on a portfolio or case study page where a creative agency wants to show client results from one engagement period against the last. It works well when you have four or fewer headline figures that carry the most weight, and you want each number to include the movement story alongside the value. Compared to a plain stat strip, this layout gives each metric room to breathe and shows the delta without requiring a separate chart.
A natural flow around it on a Marketing (Legacy) page:
Before
After
Any set of four key results where showing movement from a prior period adds meaning to the current figure. A few fits for a creative studio context:
Tip: keep all four timeframe labels consistent so readers can scan the grid without stopping to reconcile different comparison windows.