Space Mono
About Space Mono
- Source
- Google Fonts ↗
- Classification
- mono
- Weights
- 400, 700
- Features
- 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 →Space Mono is a fixed-width typeface designed by Colophon Foundry for Google Fonts. Released in 2016, it brings a distinctive geometric and technical aesthetic to monospace design.
History and Design
Colophon Foundry designed Space Mono with a vision to create a monospace font with strong geometric character and futuristic appeal. The design features precise, mechanical letterforms that evoke typewriters and early computer terminals while maintaining modern refinement. Its technical aesthetic sets it apart from more neutral monospace fonts.
Why Space Mono is Popular
Space Mono has gained a devoted following among developers and designers who want their code to have personality. It serves as a free alternative to premium monospace fonts, offering a distinctive look for coding environments, terminal interfaces, and technical branding. Its futuristic character appeals to gaming, tech, and creative industries.
Technical Features
- Two weights: Regular and Bold
- True italics: Distinct slanted forms
- Fixed width: Consistent character spacing
- Geometric design: Precise, technical letterforms
- Extended Latin: Support for Vietnamese and European languages
Best Use Cases
Space Mono excels in:
- Terminal interfaces: Distinctive command-line experience
- Tech branding: Futuristic, technical identity systems
- Gaming UIs: Sci-fi and cyberpunk aesthetics
- Data visualization: Tables and technical displays
- Creative coding: Projects with visual flair
Usage Tips
Use Space Mono at 14-16px for code editing. The geometric character can be fatiguing for very long coding sessions—consider for shorter projects or interfaces. Bold weight provides strong emphasis for syntax highlighting. Pairs naturally with Space Grotesk for cohesive technical branding. Enable ligatures if available for enhanced code appearance.
Is Space Mono on Google Fonts?
Yes, Space Mono is available for free on Google Fonts. Get Space Mono on Google Fonts ↗
Alternative For (1)
Space Mono is a free alternative to the following premium fonts:
Compare Space Mono
See how Space Mono compares to other fonts side by side.
Font Pairings
Fonts that pair well with Space Mono based on contrast and complementary design characteristics.
Performance
Key metrics for evaluating Space Mono in production.
Font Metrics
Fallback CSS Overrides
Apply these overrides to Courier New to minimize layout shift when loading Space Mono.
@font-face {
font-family: 'Space Mono Fallback';
src: local('Courier New');
ascent-override: 112%;
descent-override: 36.1%;
line-gap-override: 0%;
size-adjust: 99.2%;
} How to Use Space Mono
Copy these code snippets to quickly add Space Mono to your project.
CSS code for Space Mono
@import url('https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&display=swap'); HTML code for Space Mono
<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=Space+Mono:wght@400;700&display=swap" rel="stylesheet"> Tailwind code for Space Mono
// tailwind.config.js
module.exports = {
theme: {
extend: {
fontFamily: {
'space-mono': ['"Space Mono"', 'sans-serif'],
},
},
},
}
// Usage in HTML:
// <p class="font-space-mono">Your text here</p> Next.js code for Space Mono
// Using next/font (Next.js 13+)
import { Space_Mono } from 'next/font/google';
const space_mono = Space_Mono({
subsets: ['latin'],
weight: ['400', '700'],
});
export default function Component() {
return (
<p className={space_mono.className}>
Your text here
</p>
);
}
// Or using inline styles with Google Fonts link:
// <p style={{ fontFamily: '"Space Mono"' }}>Your text</p> Expo and React Native code for Space Mono
// Install: npx expo install @expo-google-fonts/space-mono expo-font
import { useFonts, Space_Mono_400Regular } from '@expo-google-fonts/space-mono';
export default function App() {
const [fontsLoaded] = useFonts({
Space_Mono_400Regular,
});
if (!fontsLoaded) return null;
return (
<Text style={{ fontFamily: 'Space_Mono_400Regular' }}>
Your text here
</Text>
);
}