--- title: "State of web design 2026: fonts, colors and layout of 272 websites" description: "What 272 of the best-designed websites actually ship: the most used fonts, how many are dark, typical body size, type scale, corner radius and more. Measured, not surveyed." updated: 2026-11-13 data_generated_at: 2026-11-13T00:51:05+00:00 canonical: /reports/state-of-web-design-2026 --- # State of web design 2026 We measured the rendered homepage of 272 well-designed websites (product, developer tools, studios, editorial and commerce) and counted what they actually ship. Every number below comes from computed styles and verified font files, not from a survey. The raw data is in [state-of-web-design-2026.json](./state-of-web-design-2026.json). ## Key findings - **Inter is the most used webfont**, loaded by 58 of 272 sites (21.3%). The next most common are Geist Mono (13), JetBrains Mono (11) and Geist (10). - **Typography is fragmented:** we found 460 distinct webfonts, and 407 of them are used by only one site. - **74.6% of sites are light by default**, and only 17.6% switch with the system dark mode setting. - **The median body text is 16px**, and the most common size is 16px (37.5% of sites). - **The median largest heading is 60px**, with a median type scale ratio of 1.28. - **The median content container is 1,240px wide.** - **34.9% of sites use no box shadows at all** on the homepage. ## Fonts | Rank | Font | Sites | Share | |---|---|---|---| | 1 | Inter | 58 | 21.3% | | 2 | Geist Mono | 13 | 4.8% | | 3 | JetBrains Mono | 11 | 4% | | 4 | Geist | 10 | 3.7% | | 5 | Berkeley Mono | 4 | 1.5% | | 6 | IBM Plex Mono | 4 | 1.5% | | 7 | Instrument Sans | 4 | 1.5% | | 8 | Satoshi | 4 | 1.5% | | 9 | Source Code Pro | 4 | 1.5% | | 10 | Suisse Int'l | 4 | 1.5% | | 11 | Söhne | 4 | 1.5% | | 12 | ABC Diatype | 3 | 1.1% | | 13 | Apercu | 3 | 1.1% | | 14 | GT America | 3 | 1.1% | | 15 | GT Planar | 3 | 1.1% | | 16 | Graphik | 3 | 1.1% | | 17 | Helvetica Now Display | 3 | 1.1% | | 18 | Manrope | 3 | 1.1% | | 19 | Neue Montreal | 3 | 1.1% | | 20 | ABC Favorit | 2 | 0.7% | - Sites loading no webfont at all (system fonts only): 4.4%. - Webfonts per site: median 2, up to 21. - Primary typeface classification: sans 72.8%, unclassified 16.2%, serif 8.5%, mono 2.6%. ## Color - Default scheme: light 74.6%, dark 25.4%. - Follow the system dark mode setting: 17.6%. - Pure white (#FFFFFF) background: 46.3%. Pure black (#000000) text: 21.7%. - Hue of the most prominent color: none 32%, blue 22.1%, violet 13.2%, green 10.3%, orange 9.2%, yellow 4.4%, red 4.4%, pink 2.2%, teal 2.2%. - Text-to-background contrast: median 17.6:1 (middle half between 15.1:1 and 19.9:1). ## Type | Measure | Median | Middle half | |---|---|---| | Body text | 16px | 16–18px | | Largest heading | 60px | 48–72px | | Type scale ratio | 1.28 | 1.22–1.37 | | Body line height | 1.50 | 1.40–1.50 | Most common body sizes: 16px (37.5%), 18px (15.1%), 14px (11%), 20px (4.8%), 17px (4.8%). ## Layout and shape | Measure | Median | Middle half | |---|---|---| | Content container | 1,240px | 1,100–1,312px | | Homepage height | 8,264px | 5,798–11,028px | - Most common corner radius: 0px 30.9%, pill 18.8%, 4px 8.5%, 8px 7.7%, 12px 5.1%, 6px 5.1%, 16px 4%, 2px 3.7%. - Border style: hairline 80.5%, none 12.1%, regular 6.2%, heavy 1.1%. ## The sample 305 hand-picked homepages were seeded. 23 blocked automated browsers, 3 disallow crawling in robots.txt and 5 failed to load; 2 more rendered only partly and are excluded. That leaves 272: - Product and SaaS: 65 - Developer tools and infrastructure: 55 - Commerce and consumer brands: 33 - The first 30 seeds (well-known product and tool sites): 28 - Editorial, media and culture: 25 - Design tools and creative software: 22 - Studios and agencies: 21 - Type foundries: 13 - Finance and fintech: 10 ## Stack Detected on the homepage: Google Tag Manager 55.1%, Cloudflare 41.2%, Next.js 39.7%, Tailwind CSS 38.2%, Vercel 33.1%, CloudFront 16.9%, jQuery 13.6%, shadcn/ui 11.8%, Radix UI 11.8%, PostHog 9.6%, Sanity 8.8%, React 8.8%. ## Method Measured from the rendered homepage of each site in the Emblematic index (desktop 1440px, light scheme unless noted). Fonts verified against @font-face; colors from computed styles weighted by painted area. Sites whose capture was incomplete are excluded. Each site's full spec and DESIGN.md are on its page at emblematic.dev/sites/.