Install FontSwap
Libre Franklin
About Libre Franklin
- Source
- Google Fonts ↗
- Classification
- sans-serif
- Weights
- Variable (100-900)
- Features
- Variable, Italics
Free to use, modify, and distribute. Can be used commercially without attribution.
What's allowed?
- ✓ Client work
- ✓ SaaS / Web apps
- ✓ YouTube / Video
- ✓ Sell products
- ✓ Print materials
Note: Derivative fonts must use the same license.
Full license guide →Libre Franklin is an open-source interpretation of the classic Franklin Gothic typeface, designed by Impallari Type and released in 2015. It faithfully captures the American gothic character of the original while offering modern features and comprehensive weight coverage.
History and Design
Pablo Impallari led the design of Libre Franklin as part of the Google Fonts library initiative to provide high-quality free alternatives to classic typefaces. The design closely follows Morris Fuller Benton's 1902 original while making subtle refinements for digital use.
Libre Franklin maintains the characteristic American gothic traits—sturdy construction, moderate contrast, and honest, workmanlike letterforms—while offering a complete weight range from Thin to Black that the original lacked.
Why Libre Franklin Stands Out
As a faithful Franklin Gothic revival, Libre Franklin brings one of America's most influential typefaces to projects with open-source requirements. Its variable font implementation allows for precise weight selection, and its extensive italic styles maintain the character of the uprights.
The typeface has been adopted by publishers, news organizations, and brands seeking the authoritative Franklin Gothic aesthetic without licensing costs.
Technical Features
- Variable font: Continuous weight axis from 100 to 900
- Complete italic family: Full range of italic weights
- Web optimized: Carefully hinted for screen rendering
- Extended Latin support: Covers Western European and Vietnamese
Best Use Cases
Libre Franklin excels in:
- Editorial design: Authentic newspaper and magazine typography
- Headlines: Bold weights command attention
- News and publishing: Classic journalistic character
- Branding: American gothic confidence and directness
Usage Tips
Use Black (900) or ExtraBold (800) for impactful headlines and Regular (400) for body text. The condensed proportions work well in navigation and tight layouts. Pair with a classic serif like Libre Baskerville for editorial designs. For web projects, consider subsetting to reduce file size while keeping essential weights.
Is Libre Franklin on Google Fonts?
Yes, Libre Franklin is available for free on Google Fonts. Get Libre Franklin on Google Fonts ↗
Alternative For (21)
Libre Franklin is a free alternative to the following premium fonts:
American grotesque heritage with similar editorial warmth and versatility
Similar American grotesque heritage reinterpreted for modern use
American gothic with editorial authority and strong headline weights
Faithful Franklin Gothic revival with workmanlike editorial utility
Clean American gothic with editorial pedigree and restrained character
Franklin Gothic-inspired variable sans with editorial lineage
American grotesque heritage provides editorial credibility with more conventional character
American grotesque heritage with similar tightness and editorial weight
Direct open-source revival with excellent fidelity to the original
Faithful Franklin Gothic revival with strong editorial pedigree and workmanlike clarity
Faithful Franklin Gothic revival sharing GT America's American gothic heritage
American gothic with editorial utility that parallels Neue Haas Grotesk's corporate workhorse role
American grotesque with similar versatility and comprehensive weight range
Faithful Franklin Gothic revival with strong editorial pedigree
American gothic style with similar editorial applications
Faithful Franklin Gothic revival with editorial authority and functional clarity
American grotesque with systematic construction and editorial authority
American grotesque with systematic construction and comparable editorial authority
Compare Libre Franklin
See how Libre Franklin compares to other fonts side by side.
Variable Font Axes
Libre Franklin is a variable font with 1 axis you can fine-tune.
| Axis | Min | Default | Max |
|---|---|---|---|
| wght | 100 | 400 | 900 |
Font Pairings
Fonts that pair well with Libre Franklin based on contrast and complementary design characteristics.
Performance
Key metrics for evaluating Libre Franklin in production.
- Score
- 55 /100 Average
- File Size
- 253.2 KB Medium
- Weights
- 9 (variable) + Italics
- Languages
- 3 groups CDN delivery
Font Metrics
- x-Height Ratio
- 0.53
- Cap Height Ratio
- 0.742
- Ascender
- 966
- Descender
- -246
Fallback CSS Overrides
Apply these overrides to Arial to minimize layout shift when loading Libre Franklin.
@font-face {
font-family: 'Libre Franklin Fallback';
src: local('Arial');
ascent-override: 96.6%;
descent-override: 24.6%;
line-gap-override: 0%;
size-adjust: 102.21%;
}How to Use Libre Franklin
Copy these code snippets to quickly add Libre Franklin to your project.
CSS code for Libre Franklin
@import url('https://fonts.googleapis.com/css2?family=Libre+Franklin:wght@100..900&display=swap');HTML code for Libre Franklin
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Libre+Franklin:wght@100..900&display=swap" rel="stylesheet">Tailwind code for Libre Franklin
// tailwind.config.js
module.exports = {
theme: {
extend: {
fontFamily: {
'libre-franklin': ['"Libre Franklin"', 'sans-serif'],
},
},
},
}
// Usage in HTML:
// <p class="font-libre-franklin">Your text here</p>Next.js code for Libre Franklin
// Using next/font (Next.js 13+)
import { Libre_Franklin } from 'next/font/google';
const libre_franklin = Libre_Franklin({
subsets: ['latin'],
weight: ['100', '200', '300', '400', '500', '600', '700', '800', '900'],
});
export default function Component() {
return (
<p className={libre_franklin.className}>
Your text here
</p>
);
}
// Or using inline styles with Google Fonts link:
// <p style={{ fontFamily: '"Libre Franklin"' }}>Your text</p>Expo and React Native code for Libre Franklin
// Install: npx expo install @expo-google-fonts/libre-franklin expo-font
import { useFonts, Libre_Franklin_400Regular } from '@expo-google-fonts/libre-franklin';
export default function App() {
const [fontsLoaded] = useFonts({
Libre_Franklin_400Regular,
});
if (!fontsLoaded) return null;
return (
<Text style={{ fontFamily: 'Libre_Franklin_400Regular' }}>
Your text here
</Text>
);
}