You open a brand’s site on your laptop, inspect the headline and write down the font. Job done, right? Then you check the same page on your phone and something about the font feels off. The weight is lighter. The body text looks like Roboto. The polished serif from the desktop is nowhere to be found. So which one is the brand’s real typography? Why are the mobile types different? This guide walks through how designers get an honest answer, at scale, without guessing.
Table of Contents
Here is the awkward truth for anyone who designs on a big monitor: most people will never see your work that way. StatCounter put mobile at about 59.9% of worldwide market share in October 2026, ahead of desktop at 38.51%.
Mobile types also behave differently from desktop ones. The 2025 Web Almanac found that Google Fonts shows up on about 54% of desktop sites but only 47% of mobile sites. Around 36.4% of mobile sites self-host all their fonts, compared to 31.5% on desktop.
Those are small gaps, but they tell you something. Plenty of teams load different type on phones to cut file weight, or they fall back on system fonts entirely. If you’re building a competitor or brand audit, or a moodboard from desktop screenshots, you could be studying a version most customers rarely see.
Checking one site by hand is easy. Checking 50 brands in six markets is where people start writing small scripts, and that’s where things get tricky.
A site can decide what to serve you based on more than your screen size. Your location, your network and whether you look like a bot can all change the response. A script running from a cloud server may get blocked, or it may get a stripped-down page. That’s useless if you’re trying to see what a shopper in Tokyo or Madrid sees.
This is why research teams use mobile proxies, which route requests through real carrier connections instead of an office or data center line. SOAX is one provider of this kind of service, with targeting by country, city and carrier. In practice, your scraper sees the site from the same type of network a real phone uses.
Honest take: you don’t need this for a one-off look at a single brand. It starts to earn its keep when you’re comparing lots of sites across regions, or when localized versions matter to the project.
Whether you work by hand or with a script, the clues are the same. Work through them in order.
Start with the @font-face rules in the CSS. These tell you which font files the site can load. Note the family names, weights and formats. Keep in mind that a declared font isn’t always a used font.
In Chrome DevTools, the Computed tab shows the CSS that actually applies to an element. Scroll down and you’ll also find a Rendered Fonts section, which names the font your browser really drew. This is the single most useful clue, because it cuts through long fallback stacks.
Open the Network panel and filter by Font. You’ll see which files were requested, from where and how large they are. This reveals whether fonts come from Adobe, Google or the brand’s own server.
For bigger jobs, tools like Playwright can load pages and read fonts in bulk. Remember that Playwright simulates devices through settings such as the user agent, viewport and touch support. It isn’t a real phone. Pair it with a mobile network for a closer match, and then spot-check a few results on an actual handset.
Always save a screenshot alongside your data. A spreadsheet can say “Inter, 16px,” but only an image shows you how tight the line spacing feels on a small screen.
A list of font names isn’t a type audit. To make the data useful for a real design decision, track these for every page:
A few habits can make this kind of research much better, and a few can land you in trouble.
Once you have your sheet, the fun part begins. You may find that every rival in your category uses a neutral grotesque on mobile. That’s your chance to stand out with a warmer, more characterful typeface.
Or you may learn that your favorite display face falls apart at small sizes, even though it looks stunning on your 27-inch screen. Better to find that out now than after launch.
Either way, you’re no longer guessing from a laptop. You’re designing from what real people see in their hands, and that is where your type has to do its job.
So start small. Pick five brands you admire, run them through the case file this week and see what surprises you. That quick exercise will likely teach you more about mobile types than another hour of scrolling through font inspiration boards.
Discover more practical design tips and creative perspectives in our blog
Unlock freebies for your creative projects. Explore a curated selection of fonts, graphics, and more - all absolutely free. Don't miss out, claim yours now!
Claim Free Freebies
