registry:blockpro-marketing

Metrics

shadcn/ui Metric blocks highlight key stats that build credibility. Perfect for showcasing customer numbers, performance results, or milestones in a simple, scannable way.

Metrics 1 - Wide stats row with geographic backdrop

A horizontally distributed metrics layout that pairs large headline numbers with short labels, anchored by a subtle world map background. The pattern emphasizes scale and credibility without heavy visuals. On mobile, the metrics collapse into a vertical list, keeping each stat easy to scan while preserving hierarchy.

Metrics 2 - Centered headline with inline stat columns

A metrics layout built around a strong centered heading, followed by evenly spaced stat columns with short supporting labels and optional inline links. The pattern emphasizes balance and readability, using clear vertical dividers to separate each metric. On mobile, the stats stack into a single-column list while keeping the headline and hierarchy intact.

Metrics 3 - Split content with media anchor

A two-column metrics layout that pairs a text-led stats group with a strong visual anchor. The pattern uses a left-aligned heading and compact metric blocks, balanced by a fixed-aspect image on the opposite side to create visual weight. On mobile, the image drops below the metrics and the stats stack vertically, preserving hierarchy and scanability.

Metrics 4 - Centered headline with inline stat row

A symmetric metrics layout built around a centered headline and a single horizontal row of key stats. Each metric is evenly spaced to create a calm, balanced rhythm and equal visual weight. The pattern emphasizes comparability and quick scanning. On mobile, the metrics stack vertically into a single column while keeping the headline centered to maintain hierarchy and focus.

Metrics 5 - Carded metrics row

A metrics layout where each stat is wrapped in a lightweight card. The cards create clear boundaries, making each metric feel discrete and scannable while still reading as a group. The pattern works well when metrics need visual emphasis without heavy decoration. On mobile, cards stack vertically with consistent spacing, preserving rhythm and hierarchy.

Metrics 6 - Inline metrics with dividers

A single-row metrics layout that uses subtle vertical dividers instead of cards. This keeps the section feeling light and flat while still giving each metric clear separation. Works well when metrics are supporting evidence rather than the main focal point. On smaller screens, the metrics stack into a clean vertical list with the same divider rhythm preserved.

Metrics 7 - Inline stats row with optional links

A centered section header paired with a single horizontal row of key stats. Uses generous whitespace and consistent column widths to make the numbers feel calm and easy to scan. On smaller screens, the row collapses into a clean vertical stack without changing the overall rhythm.