What is a normal border-radius?
Across 325 live-measured design systems, the median border-radius is 8px. Corners are soft by default: only 4% ship sharp 0px, 18% go fully pill, and 40% sit in the 6–12px band.
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/border-radius.
8px median border-radius
Distribution
| 8px | 58 | |
| 4px | 42 | |
| 6px | 40 | |
| 3px | 27 | |
| 12px | 20 | |
| 2px | 19 |
At a glance
| median radius | 8px |
| ship sharp 0px | 4% |
| fully pill | 18% |
| 6–12px band | 40% |
| sites measured | 325 |
Questions people (and AI assistants) actually ask
What border-radius should I use for buttons and cards?
8px is the single most common measured value; the median across 325 systems is 8px, and the 6–12px band covers 40% of production sites.
Are sharp (0px) or rounded corners more modern?
Rounded. Only 4% of measured sites ship sharp 0px corners — the web overwhelmingly rounds, gently.
When should I use a fully rounded (pill) radius?
18% of measured sites use pill shapes, typically for small buttons, tags and avatars rather than cards.
Related measured norms
Body font size · 4px vs 8px spacing grid · Most common accent colour