Project 01 · Behind the data

Methodology, sources
and design system.

Every figure in The Cost of War comes from a public source and a documented choice. This page gathers the sources, the methodological notes and the design system behind the project — so the reader can verify, reproduce and disagree.

01 · Sources

The data.

The project relies on public, traceable sources: international datasets, research institutes, statistical agencies and journalistic reporting for the most recent section. When multiple sources describe the same phenomenon, the page explains which figure is used and where caution is required.

  • ACLEDArmed Conflict Location & Event Data
    Global event-level conflict data. Monthly aggregations 2015–2025 and country-level totals 2022–2024 feed sections 02 and 03.
  • UNHCRvia Our World in Data
    Refugee population by country of asylum and country of origin, end-2024. The two are different lenses — section 04 specifies which one it is using and where.
  • SIPRI Military ExpenditureApril 2025 release
    Constant 2023 USD for the spending time-series; current 2024 USD for the headline figures — 37% U.S. share and $2.718T global total. Country-level 2024 spend feeds the section 03 bubble field.
  • World Bank CMOPink Sheet, April 2026
    Wheat (US HRW), DAP fertilizer, Brent crude, natural gas Europe. Series indexed to January 2021 = 100 for section 05.
  • OECD Employment Outlook 2024real hourly wages
    CPI-deflated real wages, Q4 2021 → Q4 2023. Used in the section 05 wages row.
  • FAO Food Price Indexcontext only
    Referenced as context. The section 05 wheat series uses World Bank Wheat HRW, a commodity-specific price, rather than the composite FAO Cereals index.
  • UN WPP 2023World Population Prospects
    Population denominators for the per-100,000 normalisation in section 02.
  • EIA · Reuters · AP · UNHCRactive-conflict reporting
    Primary attribution for section 06 — the active-conflict window between February and April 2026, frozen at 12 April.
02 · Notes

Methodological notes.

Where a number deserves a caveat — different units, different definitions, mixed sources — the explanation sits here, so the sections themselves can stay focused.

Section 02Where the dying is concentrated.
Country deaths are shown both in absolute terms and per 100,000 people. The 994 Palestine per 100k figure comes from ACLED conflict deaths 2022–2024 divided by the 2023 UN WPP mid-year population for the Palestinian Territories. The map covers 229 countries: 155 with recorded deaths, 74 with zero. Zero is a finding, not an absence.
Section 03Power and exposure.
The $10.9M per conflict death ratio is SIPRI's 2024 world total ($2,718B current USD) divided by ACLED's 2024 global conflict deaths (250,296). The bubble field's x-axis is military spending; the y-axis is conflict deaths 2022–2024. The ratio is descriptive, not causal — an editorial frame, not a claim of cost-effectiveness.
Section 04Years of exile.
Section 04 uses both UNHCR series at different points. The 31M total at end-2024 (origin) is close to a record — only 2023 was higher. The ≈70% hosted in low- and middle-income countries figure comes from the asylum series combined with the World Bank income classification. UNHCR asylum data for China after 2020 is excluded because of a documented OWID discontinuity.
Section 05After the fault line.
The wages row uses the OECD Employment Outlook 2024 CPI-deflated real hourly wages (Q4 2021 → Q4 2023), not the constant USD-PPP series. The two are not interchangeable: the same country can move down on one and up on the other. The CPI-deflated series was chosen because it reflects the cost-of-living shock central to the section's argument.
Section 06The signal.
Section 06 is not a live monitor. It is a snapshot frozen on 12 April 2026. In an active conflict, sources can diverge: casualty figures are therefore shown separately when they refer to different geographies, dates or definitions. Figures are not added unless the source itself defines them as a comparable total. The three Iran casualty figures (1,332 / 3,000+ / 5,000+) sit side by side for exactly this reason.
03 · Design system

One consistent system.

A single palette, a single typographic voice, a single grid. The system is small on purpose — every constraint is a choice the reader can follow.

Colour as a reading key

The project uses a semantic palette: the same colours carry the same meaning across the sections. This helps the reader follow how the military shock moves into other systems — exile, energy, food, wages and public spending. When a figure combines different categories — for example total conflict deaths — it is treated with visual caution, so unlike phenomena are not collapsed into a single signal.

Civilians civilian victims · non-combatants killed · direct human loss
Exile refugees · displaced people · people forced from home
Power military spending · state capacity · war-making apparatus
Food wheat · fertilizer · pressure on food systems
Energy gas · oil · fuel prices · energy infrastructure
Wages real income · purchasing power · household economy
Fatalities total conflict deaths · an aggregate figure to be read with caution
Typography
Cormorant Garamond
Display — editorial serif, the voice of the project. Used for titles, KPIs and italic counterpoint.
DM Sans
Body — neutral and legible. Used for long-form copy and short descriptions.
Geist Mono
Editorial mono — for navigation, eyebrows and short technical labels.
JetBrains Mono
General mono — used for tabular data and code-like elements.
Layout grid
1240 px
Max content width
56 / 24 px
Gutters · desktop / small screens
56 px
Nav height · baseline grid
04 · Tools

A lean stack.

The project is built as a lightweight web experience: HTML, CSS and JavaScript. The choice is intentional — fewer dependencies, more control over narrative form and visual detail.

Stack
HTML, CSS, vanilla JavaScript. No framework, no charting library, no build step.
Charts
All bespoke. SVG for sections 01–03. HTML5 Canvas for sections 04 and 05. A hybrid SVG + Canvas stage for section 06.
Motion
Animations driven by native browser APIs and scroll-linked reveals. No animation library.
Accessibility
Every chart is labelled for screen readers, reduced motion is respected, and sections 01–04 expose a tabular view of the underlying data.
Coding tools
Standard code editor and version control, with Claude Code (Anthropic) used as a coding assistant. Editorial decisions, sources and design choices stay with the author.
05 · Author

Carmelo Bagalà.

Coralit\x Data Lab is an editorial and design lab for projects, articles, dashboards, apps and interactive visualizations built with data. The Cost of War is the first project in this series.