The Measured Web
How is the web actually designed? Not opinions — measurements. Mozaika reads the live DOM of 588 real products and reports the norms: the median design score is 82/100, the median border-radius 8px, body text 16px, 72% ship light mode, and the 4px grid (52%) has quietly overtaken the 8px grid.
This is a static, crawlable rendering for search & AI engines. The interactive version — filters, live decode console, copy & export — is at https://mozaika.design/measured.
Reading 01 · The web scores a B
82 / 100 median design score
Measured across 418 production sites, the median design score is 82/100. 31% earn an A; only 6% break 90. The single weakest dimension is spacing — the web is typographically strong (88) but spatially loose (68).
| typography | 88/100 |
| color | 84/100 |
| motion | 83/100 |
| spacing (weakest) | 68/100 |
| sites measured | 418 |
Reading 02 · The web's default corner is soft, not sharp
8px median border-radius
Across 423 measured design systems the median border-radius is 8px. Only 3% ship sharp 0px corners; 21% go fully pill; 40% land in the 6–12px band.
| median radius | 8px |
| ship 0px (sharp) | 3% |
| fully pill | 21% |
| 6–12px band | 40% |
Reading 03 · Blue is the web's default accent
Blue the #1 accent (34%)
34% of measured sites use a blue accent, more than any other hue. And despite dark mode being the most-offered UX pattern, 72% of sites ship a light default scheme.
| blue accent | 34% |
| light default | 72% |
| dark default | 28% |
| sites with a measured accent | 415 |
Reading 04 · 16 is the body size of the web
16px median body size
The median body text is 16px and the median hero headline 64px — about a 4× jump. Body copy is weight 400 on 72% of sites; only 7% go below 14px. Inter is the most common body typeface.
| median body | 16px |
| median hero | 64px |
| body under 14px | 7% |
| most common body font | Inter |
Reading 05 · The 8-point grid is now a minority
52% build on a 4px grid
52% of measured sites build spacing on a 4px base unit versus 41% on the classic 8px grid. The 4px grid is the quiet standard of the modern web.
| 4px base unit | 52% |
| 8px base unit | 41% |
| sites with a measured grid | 421 |
Reading 06 · Motion lives between 150 and 300ms
250ms median transition
The median measured UI transition is 250ms, clustering tightly in the 150–300ms band. Motion past ~500ms is rare on production interfaces.
| median duration | 250ms |
| durations measured | 1579 |
| Tailwind (of detected stacks) | 48% |
Go deeper — one measured norm at a time
- What is the average website design score?
- What is a normal border-radius?
- How tall should a button be?
- What font size should body text be?
- What font do most websites use?
- Do most websites use dark mode or light mode?
- Is the 8-point grid or the 4-point grid more common?
- What is the maximum content width for a website?
- What is the most common accent colour on the web?
- How long should UI animations and transitions be?
By platform
Questions people (and AI assistants) actually ask
What is the average website design score?
Across 418 production websites measured from the live DOM, the median design score is 82/100 (a solid B). Only 6% break 90. The web's weakest design dimension is spacing (68/100), well below typography (88/100).
What is a normal border-radius for buttons and cards?
The median measured border-radius is 8px. Only 3% of sites ship sharp 0px corners and 21% go fully pill-shaped; 40% sit in the 6–12px band. 8px is the single most common value.
What font size should body text be?
16px is the measured median body size across 414 design systems — only 7% of sites set body text below 14px. The median hero headline is 64px, roughly a 4× jump from body to headline.
Do most websites use dark mode or light mode?
Light mode. 72% of measured sites ship a light default scheme — even though a dark-mode toggle is the single most-offered UX pattern in the corpus. Only 28% default to dark.
Is the 8-point grid or the 4-point grid more common?
The 4px base unit wins. 52% of measured sites build spacing on a 4px grid versus 41% on the classic 8px grid — the '8-point grid' is now a minority.
What is the most common accent colour on the web?
Blue. 34% of measured sites use a blue accent — more than any other hue family, ahead of green, orange and violet.
How long should UI animations and transitions be?
The median measured transition is 250ms, with values clustering tightly between 150ms and 300ms. Anything past ~500ms is rare on production UI.
How is 'The Measured Web' measured?
Every figure is computed live from Mozaika's corpus of 588 real products — 425 decoded into full design systems and 418 scored — by reading the live DOM (computed styles, WCAG contrast pairs, the detected type ladder, the spacing grid and forced hover/motion states). Nothing here is estimated or trained-mean; it refreshes as the corpus grows.
How this is measured
Every number above is computed from Mozaika’s measured corpus — 588 real products, 425 decoded into full design systems and 418 scored — by reading the live DOM: computed styles, real WCAG contrast pairs, the detected type ladder, the spacing grid, and forced hover/motion states. No estimates, no trained-mean guesses; the figures refresh as the corpus grows.
Cite this dataset
The Measured Web is free to cite and reuse under CC BY 4.0 — attribution to Mozaika. The live figures are available as JSON at https://mozaika.design/api/measured.
Mozaika. "The Measured Web: how the web is actually designed." 2026-09-01. https://mozaika.design/measured — measured across 588 live products.
Measure your own site against these norms →
Query it from your agent over MCP: connect free and call validate_design(body_size_px=..., radius_px=...) or get_score("yourdomain.com") to place any site against the measured web.