# World population

> An infographic poster: hero numbers, an interactive stacked area chart by region and a bar timeline of every billion, from UN World Population Prospects data.

An infographic poster in one HTML page: three hero numbers, an interactive stacked area chart, a bar timeline and a sparkline of twelve thousand years. Every chart is inline SVG drawn by a few lines of script from the numbers in the page, and every color is a token that switches with the site's dark mode.

## At a glance

**8.23bn** people alive in 2025, more than three times the 1950 count

**10.3bn** the projected peak, reached in the mid-2080s before a slow decline

**×17** Africa's growth from 1950 to 2100, from 228 million to 3.8 billion

## Population by region

billions, 1950–2100 · hover for values

- **Asia
- **Africa
- **Europe
- **Latin America
- **Northern America
- **Oceania

Asia peaks at 5.29 billion around 2055; after that, nearly all growth is African.

## Years to add each billion

1. **2 bn**1927122
2. **3 bn**196033
3. **4 bn**197515
4. **5 bn**198712
5. **6 bn**199811
6. **7 bn**201012
7. **8 bn**202212
8. **9 bn**203715
9. **10 bn**206124

Bars in years; \* UN medium-variant projection. The first billion: 1805.

## The last 12,000 years

billions

For 11,800 of those years the line is flat: it took until 1805 to reach one billion, and only 220 more to reach eight.

Data table

| Year | Asia | Africa | Europe | Latin America | N. America | Oceania | World |
| ---- | ---- | ------ | ------ | ------------- | ---------- | ------- | ----- |

## How it's built

- **Hero numbers** are a wrapping flex row whose 1px gap shows the border color through, so the tiles get hairline dividers without a single border rule.
- **The stacked area** is computed in the browser: each region's band is a path from its baseline to its top, and an invisible overlay snaps the crosshair to the nearest five-year step. A `ResizeObserver` redraws it at the real width, so the labels stay 11px on a phone.
- **The billion timeline** is no chart library at all: each bar is a `::before` whose width is a `--years` custom property, and the projected rows switch to a hatched fill.

Source: [UN World Population Prospects 2024](https://population.un.org/wpp/), with the long-run series from HYDE and Gapminder, as compiled by [Our World in Data](https://ourworldindata.org/population-growth).