Install FontSwap
Questrial
About Questrial
- Source
- Google Fonts ↗
- Classification
- sans-serif
- Weights
- 400
- Features
- Standard
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 →Questrial is a geometric sans-serif typeface designed by Joe Prince. With its wide proportions and clean circular forms, it serves as an excellent free alternative to Century Gothic and similar geometric fonts from the 1990s digital era.
History and Design
Joe Prince designed Questrial with the goal of creating a clean, modern sans-serif with geometric foundations. The typeface features notably wide letterforms and generous spacing, similar to Century Gothic and ITC Avant Garde Gothic. Its circular 'O' and consistent stroke widths create a harmonious, balanced appearance.
The design prioritizes clarity and simplicity, making it readable across various sizes while maintaining strong visual character.
Why Questrial Works
Questrial fills a specific niche: it provides the wide, geometric aesthetic of Century Gothic without licensing costs. Its clean forms work well for both print and digital applications, particularly where a modern, sophisticated appearance is needed. The generous spacing aids readability in longer passages while maintaining impact at headline sizes.
Technical Features
- Single weight: Regular (400) only
- Wide proportions: Similar to Century Gothic
- Geometric forms: Based on circles and straight lines
- Vietnamese support: Extended Latin character set
- Clean design: Minimal decorative elements
Best Use Cases
Questrial excels in:
- Presentations: Clean appearance in slides and documents
- Logos and wordmarks: Simple geometric elegance
- Print materials: Wide letterforms for headlines
- Minimalist design: Uncluttered modern aesthetic
Usage Tips
Questrial's single weight limits its versatility, so consider pairing it with another font family for body text if you need weight variation. It works best for headlines and display use where its wide proportions can be appreciated. For a complete typographic system, pair Questrial headlines with a more versatile body font like Open Sans or Source Sans Pro. The generous letter spacing means you may want to tighten tracking slightly at very large sizes.
Limitations
Note that Questrial only comes in a regular weight with no italics. For projects requiring bold text or emphasis, you'll need to supplement with another font or use color and size for hierarchy.
Is Questrial on Google Fonts?
Yes, Questrial is available for free on Google Fonts. Get Questrial on Google Fonts ↗
Alternative For (4)
Questrial is a free alternative to the following premium fonts:
Compare Questrial
See how Questrial compares to other fonts side by side.
Font Pairings
Fonts that pair well with Questrial based on contrast and complementary design characteristics.
Performance
Key metrics for evaluating Questrial in production.
Font Metrics
Fallback CSS Overrides
Apply these overrides to Arial to minimize layout shift when loading Questrial.
@font-face {
font-family: 'Questrial Fallback';
src: local('Arial');
ascent-override: 82%;
descent-override: 21%;
line-gap-override: 0%;
size-adjust: 96.42%;
}How to Use Questrial
Copy these code snippets to quickly add Questrial to your project.
CSS code for Questrial
@import url('https://fonts.googleapis.com/css2?family=Questrial:wght@400&display=swap');HTML code for Questrial
<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=Questrial:wght@400&display=swap" rel="stylesheet">Tailwind code for Questrial
// tailwind.config.js
module.exports = {
theme: {
extend: {
fontFamily: {
'questrial': ['Questrial', 'sans-serif'],
},
},
},
}
// Usage in HTML:
// <p class="font-questrial">Your text here</p>Next.js code for Questrial
// Using next/font (Next.js 13+)
import { Questrial } from 'next/font/google';
const questrial = Questrial({
subsets: ['latin'],
weight: ['400'],
});
export default function Component() {
return (
<p className={questrial.className}>
Your text here
</p>
);
}
// Or using inline styles with Google Fonts link:
// <p style={{ fontFamily: "'Questrial'" }}>Your text</p>Expo and React Native code for Questrial
// Install: npx expo install @expo-google-fonts/questrial expo-font
import { useFonts, Questrial_400Regular } from '@expo-google-fonts/questrial';
export default function App() {
const [fontsLoaded] = useFonts({
Questrial_400Regular,
});
if (!fontsLoaded) return null;
return (
<Text style={{ fontFamily: 'Questrial_400Regular' }}>
Your text here
</Text>
);
}