TechnicalCollectible prompt

Stats band built from real numbers with sources

Three or four provable numbers, formatted well and footnoted, instead of vanity counters.

v0LovableCursor

Curated by Nvoka

Nvoka wordmark logo
Nvoka wordmark logoTechnical

Stats band built from real numbers with sources

Act as a designer who has been burned by fake stats. Build a stats band for {{business_name}} in this style: {{visual_style}}. First, ask me for 3 or 4 numbers and the source of each (analytics, database, survey, third-party report) with its date. If I can't source one, drop it and suggest provable alternatives: years in business, median response time, jobs completed, average rating with review count. Each stat: the number, a short label in plain words ("median reply time"), and a footnote marker, a real link with a visible focus ring, pointing to a sources line below the band ("Bookings from our system, January to June 2026"). Formatting: - Intl.NumberFormat in the visitor's locale; compact notation only above 10,000 ("12.4K") - tabular-nums, the same precision across stats, units set close to the number - no "+" unless the number is a real floor you can defend Layout: 360: 2 by 2 grid; 768: 4 in a row if they fit, else 2 by 2; 1280: 4 columns separated by 1px dividers, max width 1100px. Padding 48 / 64 / 80px. Numbers 40 / 48 / 64px, weight 700, tracking -0.02em; labels 14 to 16px at 4.5:1. Semantics: a dl, or a list with each number and label read together. Screen readers hear "4.9 out of 5 average rating", not "4.9" alone. Count-up (optional): runs once when in view, 800ms ease-out, and the real final value is in the HTML from the start, so no-JS readers and crawlers see it. Under prefers-reduced-motion, show the final value. States: long labels wrap to 2 lines, centered under their number; a stat older than 12 months shows its as-of date. If data comes from the database, cache it and fall back to the last good value, never zero. Avoid: "10,000+ happy customers", uptime claims with no status page, icons in gradient circles above each number, counters that restart on every scroll.
Technicalnvoka.com/library/nvoka-stats-band-built-from-real-numbers-with-sourcesScan to open
Technical

Stats band built from real numbers with sources

Three or four provable numbers, formatted well and footnoted, instead of vanity counters.

Nvoka logo

Curated by Nvoka

v0LovableCursor
Add to my library

Make it yours

Fill in the blanks and change any word. Only your copy changes, never the card.

Fill in the blanks

0 of 2 filled

Your prompt

Act as a designer who has been burned by fake stats. Build a stats band for {{business_name}} in this style: {{visual_style}}. First, ask me for 3 or 4 numbers and the source of each (analytics, database, survey, third-party report) with its date. If I can't source one, drop it and suggest provable alternatives: years in business, median response time, jobs completed, average rating with review count. Each stat: the number, a short label in plain words ("median reply time"), and a footnote marker, a real link with a visible focus ring, pointing to a sources line below the band ("Bookings from our system, January to June 2026"). Formatting: - Intl.NumberFormat in the visitor's locale; compact notation only above 10,000 ("12.4K") - tabular-nums, the same precision across stats, units set close to the number - no "+" unless the number is a real floor you can defend Layout: 360: 2 by 2 grid; 768: 4 in a row if they fit, else 2 by 2; 1280: 4 columns separated by 1px dividers, max width 1100px. Padding 48 / 64 / 80px. Numbers 40 / 48 / 64px, weight 700, tracking -0.02em; labels 14 to 16px at 4.5:1. Semantics: a dl, or a list with each number and label read together. Screen readers hear "4.9 out of 5 average rating", not "4.9" alone. Count-up (optional): runs once when in view, 800ms ease-out, and the real final value is in the HTML from the start, so no-JS readers and crawlers see it. Under prefers-reduced-motion, show the final value. States: long labels wrap to 2 lines, centered under their number; a stat older than 12 months shows its as-of date. If data comes from the database, cache it and fall back to the last good value, never zero. Avoid: "10,000+ happy customers", uptime claims with no status page, icons in gradient circles above each number, counters that restart on every scroll.
See all