MozaikaHow the web is actually designed

The Measured Web

Computed live from 574 products · 326 decoded · 324 scored · updated 2026-07-17

How is the web actually designed? Not opinions — measurements. Mozaika reads the live DOM of 574 real products and reports the norms: the median design score is 82/100, the median border-radius 8px, body text 16px, 75% ship light mode, and the 4px grid (54%) has quietly overtaken the 8px grid.

Open in Mozaika →

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 324 production sites, the median design score is 82/100. 30% earn an A; only 4% break 90. The single weakest dimension is spacing — the web is typographically strong (88) but spatially loose (67).

typography88/100
color85/100
motion83/100
spacing (weakest)67/100
sites measured324

Reading 02 · The web's default corner is soft, not sharp

8px median border-radius

Across 325 measured design systems the median border-radius is 8px. Only 4% ship sharp 0px corners; 18% go fully pill; 40% land in the 6–12px band.

median radius8px
ship 0px (sharp)4%
fully pill18%
6–12px band40%

Reading 03 · Blue is the web's default accent

Blue the #1 accent (33%)

33% of measured sites use a blue accent, more than any other hue. And despite dark mode being the most-offered UX pattern, 75% of sites ship a light default scheme.

blue accent33%
light default75%
dark default25%
sites with a measured accent321

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 6% go below 14px. Inter is the most common body typeface.

median body16px
median hero64px
body under 14px6%
most common body fontInter

Reading 05 · The 8-point grid is now a minority

54% build on a 4px grid

54% of measured sites build spacing on a 4px base unit versus 40% on the classic 8px grid. The 4px grid is the quiet standard of the modern web.

4px base unit54%
8px base unit40%
sites with a measured grid325

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 duration250ms
durations measured1204
Tailwind (of detected stacks)47%

Go deeper — one measured norm at a time

Questions people (and AI assistants) actually ask

What is the average website design score?

Across 324 production websites measured from the live DOM, the median design score is 82/100 (a solid B). Only 4% break 90. The web's weakest design dimension is spacing (67/100), well below typography (88/100).

What is a normal border-radius for buttons and cards?

The median measured border-radius is 8px. Only 4% of sites ship sharp 0px corners and 18% 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 318 design systems — only 6% 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. 75% 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 25% default to dark.

Is the 8-point grid or the 4-point grid more common?

The 4px base unit wins. 54% of measured sites build spacing on a 4px grid versus 40% on the classic 8px grid — the '8-point grid' is now a minority.

What is the most common accent colour on the web?

Blue. 33% 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 574 real products — 326 decoded into full design systems and 324 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 — 574 real products, 326 decoded into full design systems and 324 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-07-17. https://mozaika.design/measured — measured across 574 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.