HTML Stats Section Templates

30 stats sections in plain HTML and CSS. Responsive, accessible and free for personal and commercial use.

Stats sections 30

Stats section 01 · Counter row

Four big numbers that count up when scrolled into view, separated by dividers, under a short heading.

Open
Stats section 02 · KPI cards with sparklines

Four metric cards with icon, value, change badge and a small SVG trend line. Works for dashboards and reports.

Open
Stats section 03 · Bar chart with highlights

An SVG bar chart comparing this year and last, with a legend and three highlight numbers. No chart library needed.

Open
Stats section 04 · Progress rings

Four circular progress rings drawn in SVG with a percentage in the middle. Rings fill in when they scroll into view.

Open
Stats section 05 · Big number with breakdown

One giant hero metric next to horizontal bars that break it down by category. Strong for impact reports.

Open
Stats section 06 · Achievements and awards

Six award badges in laurel-style frames with year and issuer. Builds trust without needing real logos.

Open
Stats section 07 · Trust badge strip

A compact strip of trust signals: rating, secure checkout, guarantee, delivery and support. Fits under heroes or above checkouts.

Open
Stats section 08 · Dark stats with line chart

A dark section with a glowing SVG area chart and four stat tiles beside it. Built for SaaS growth and investor pages.

Open
Stats section 09 · Before and after numbers

Side-by-side "before" and "with us" bars for four metrics, with the improvement called out. Great for case studies.

Open
Stats section 10 · Local business numbers

A warm, photo-free stats band for local businesses: years open, jobs done, rating and response time, with a call button.

Open
Stats section 11 · Savings calculator

An interactive ROI section: sliders for team size, hours lost per week and hourly cost drive three live results (hours saved, money saved, payback) with a bar comparison.

Open
Stats section 12 · Annual report numbers

An editorial annual-report spread: a giant headline number, a short letter excerpt, and a ruled grid of supporting figures with small captions and year-on-year arrows.

Open
Stats section 13 · Live activity counters

A “happening right now” band: numbers that tick up live (orders today, trees planted, people online), a pulse indicator, a mini sparkline per counter and the last updated time.

Open
Stats section 14 · Us vs industry average

A benchmark section comparing a courier’s numbers against the industry average: paired horizontal bars per metric, the gap called out as a badge and a short source note.

Open
Stats section 15 · Conversion funnel

A tapered funnel chart for a SaaS growth story: four stages with counts and step conversion rates, a highlighted best step and a month switch that updates the numbers.

Open
Stats section 16 · Where your money goes

A charity transparency section: a donut chart of spending with a centre label that changes as you hover or focus each slice or legend row, plus a “every £10 gives…” strip.

Open
Stats section 17 · Uptime status grid

A reliability section like a status page: overall uptime, a 90-day bar per service (green, amber, red) with tooltips, response time numbers and recent incident notes.

Open
Stats section 18 · Campaign goal tracker

A crowdfunding progress section: amount raised vs goal with an animated bar and stretch-goal markers, backers and days left, recent backer avatars and reward tiers to pick.

Open
Stats section 19 · Activity heatmap

A habit app’s yearly streak section: a 26-week contribution-style heatmap with intensity legend, current and longest streak counters and best day of the week.

Open
Stats section 20 · Community impact

A local council or co-op impact section: a small illustrated town skyline with numbered pins, each pin tied to a stat card (homes insulated, buses, trees, solar roofs) that highlights on hover.

Open
Stats section 21 · Regional tile map

Where your customers are: a tile map of twelve regions shaded by count, with a hover or tap readout, a legend scale and a ranked top-five list beside it.

Open
Stats section 22 · Year in review cards

A running app’s “your year” story: big swipeable stat cards with progress dots, autoplay with pause, previous/next taps and a share button. Works with keys and touch.

Open
Stats section 23 · Growth milestones chart

A line chart of members over eight years with milestone flags you can step through: each step moves a marker and updates the year, number and story beside the chart.

Open
Stats section 24 · Impact facts label

A coffee roaster’s sustainability numbers styled like a nutrition facts label: bold rules, per-bag figures, percentages of a goal, and a footnote, next to short copy.

Open
Stats section 25 · Leaderboard with movement

A schools reading challenge leaderboard: podium for the top three, a ranked table with weekly movement arrows, a progress bar to the next place and a this-week / all-time switch.

Open
Stats section 26 · Pictogram “1 in 4” grid

A charity statistic told with a 100-figure pictogram: one in four highlighted, a toggle to show what changes with your support, and plain-English captions beside.

Open
Stats section 27 · Home solar today

A solar company’s customer stats: a gauge of energy made today, hour-by-hour bars for generated vs used, money saved, CO₂ avoided and battery level.

Open
Stats section 28 · Survey results bars

Patient survey results as diverging stacked bars: five-point agreement per question, net score, a legend, sort by score and a sample size note.

Open
Stats section 29 · Stats by audience tabs

A hospital’s headline numbers in three tabs for patients, clinicians and the community. Each panel has three big figures, an illustrated portrait and a link.

Open
Stats section 30 · City cost comparison

A remote-work platform’s city comparison: pick two cities and see side-by-side bars for rent, lunch, travel, coffee and bread, with the overall difference in a headline.

Open