Install FontSwap
“Roboto Condensed” is one of the most-searched font names that doesn’t need to be searched for. If you already have Roboto, you already have it.
The one-line answer
The variable version of Roboto carries two axes: weight from 100 to 900, and width from 75 to 100. wdth 75 is Roboto Condensed. Same design, same file, no second download.
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100..900&display=swap');
.headline {
font-family: "Roboto", sans-serif;
font-variation-settings: "wdth" 75, "wght" 700;
}Because the axis is continuous, you aren’t limited to the one condensed cut Google publishes as a static family. wdth 88 gives you a semi-condensed that has no separate download at all, which is often exactly what a nav bar wants — narrower than default, not obviously compressed.
Worth knowing before you commit: Roboto’s width axis stops at 75. It does not go wider than normal, and it does not reach the extra-condensed territory that a poster might want. For that, look below.
The same trick, in other families
Nine other free families in our collection ship a real width axis. If you’re loading any of these already, the condensed cut is free:
| Font | Width range | How narrow it gets |
|---|---|---|
| Inconsolata | 50–200 | Half-width to double-width; monospace |
| Saira | 50–125 | Extra-condensed through extended |
| Noto Sans | 62.5–100 | ExtraCondensed |
| Noto Serif | 62.5–100 | ExtraCondensed, serif |
| Anek Latin | 75–125 | Condensed and extended |
| Google Sans Flex | 75–125 | Condensed and extended |
| Mona Sans | 75–125 | Condensed and extended |
| Hubot Sans | 75–125 | Condensed and extended |
| Bricolage Grotesque | 75–100 | Condensed |
Saira deserves a specific mention. Its 50–125 range is the widest span of any general-purpose sans here, and Héctor Gatti drew it explicitly as an industrial family with width variation in mind. If your requirement is “condensed, technical, and I might need extended later,” it covers more ground than Roboto does.
When the axis isn’t the answer
Not every “X Condensed” search resolves this neatly. Three common ones that don’t:
Ubuntu Condensed is a separate family from Ubuntu, not a width instance, and Ubuntu itself isn’t in our free-font collection. The nearest free substitutes by feel are Saira at wdth 75 — similar humanist-industrial temperament — or Barlow Condensed if you want the full weight range.
Cabin Condensed is likewise its own family. Cabin is variable, but only on weight (400–700) — there is no width axis to reach for. Cabin’s own lineage runs back through Johnston and Gill, so if you need a condensed humanist with that warmth, Barlow Condensed is the closer match than anything geometric.
Aperçu Condensed is a commercial typeface from Colophon, so there’s no axis and no free version of the family itself. For the neutral-with-personality quality that makes people want Aperçu, Hubot Sans at wdth 75 or Mona Sans at wdth 75 get closest among free options — both are GitHub’s, both OFL, both genuinely well-drawn.
Static family or width axis?
A drawn condensed family has had every counter, join and sidebearing corrected by hand for the narrow width. A width axis interpolates between masters. In the middle of the range those are nearly indistinguishable; at the extremes, a drawn cut wins on the fine detail.
The practical rule I’d use:
- Interface, body text, tables, anything under 24px — use the axis. One file, consistent skeleton, and nobody is examining the joins at 14px.
- Display, posters, logotypes, anything set large — use a drawn family like Barlow Condensed, Oswald or Bebas Neue, where the letterforms are the design.
There’s also a loading argument. A variable font with a width axis is one request covering every width and weight you might use. Two static families — regular plus condensed — is two requests and two font-file payloads, for strictly less flexibility.
FAQ
Is Roboto Condensed free for commercial use? Yes. Roboto is Apache-2.0 licensed, which permits commercial use, modification and redistribution, including bundling in a product.
Why does Google Fonts still list Roboto Condensed separately? Backward compatibility. The static families predate the variable release, and thousands of existing sites reference them by name. The static download still works — it’s just redundant if you’re loading variable Roboto.
Does font-stretch work instead of font-variation-settings?
Yes, and it’s the better choice where supported: font-stretch: 75% is the standard CSS property mapped to the wdth axis, and it inherits and animates more predictably than raw variation settings. Use font-variation-settings for axes with no CSS property of their own.
How much smaller is condensed, really?
At wdth 75 you should expect roughly 15–20% more characters per line, depending on the string. It varies with the copy — text heavy in round letters (o, e, c) compresses more than text heavy in narrow ones (i, l, t).