Install FontSwap
Instrument Sans
About Instrument Sans
- 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 →Instrument Sans was designed by Rodrigo Fuenzalida and Jordan Egstad for the Instrument brand and released on Google Fonts. Its designers describe it as balancing precision with "subtle notes of playfulness", drawn from a long-standing interest in neo-grotesques.
The stylistic sets
Much of that playfulness lives in the alternates. Instrument Sans includes 12 stylistic sets that swap commonly used characters for alternate glyphs, so the same family can look strictly neutral in a product interface and a little more idiosyncratic in a campaign headline. Enable them through your design tool's OpenType panel or CSS font-feature-settings, and review the result, because some combinations change the texture noticeably.
Weights and widths
The variable font has two axes: weight from Regular (400) to Bold (700) and width from 75 to 100. The width axis gives you condensed styles for tight layouts without loading a second family, and italics are included. There are no light weights, so it is less suited to airy, thin-stroke display work.
Language support is Latin and Latin Extended. Instrument Sans is free under the SIL Open Font License 1.1 from Google Fonts.
Is Instrument Sans on Google Fonts?
Yes, Instrument Sans is available for free on Google Fonts. Get Instrument Sans on Google Fonts ↗
Compare Instrument Sans
See how Instrument Sans compares to other fonts side by side.
Variable Font Axes
Instrument Sans is a variable font with 2 axes you can fine-tune.
| Axis | Min | Default | Max |
|---|---|---|---|
| wght | 400 | 400 | 700 |
| wdth | 75 | 100 | 100 |
How to Use Instrument Sans
Copy these code snippets to quickly add Instrument Sans to your project.
CSS code for Instrument Sans
@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:wght@100..900&display=swap');HTML code for Instrument Sans
<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=Instrument+Sans:wght@100..900&display=swap" rel="stylesheet">Tailwind code for Instrument Sans
// tailwind.config.js
module.exports = {
theme: {
extend: {
fontFamily: {
'instrument-sans': ['"Instrument Sans"', 'sans-serif'],
},
},
},
}
// Usage in HTML:
// <p class="font-instrument-sans">Your text here</p>Next.js code for Instrument Sans
// Using next/font (Next.js 13+)
import { Instrument_Sans } from 'next/font/google';
const instrument_sans = Instrument_Sans({
subsets: ['latin'],
weight: ['100', '200', '300', '400', '500', '600', '700', '800', '900'],
});
export default function Component() {
return (
<p className={instrument_sans.className}>
Your text here
</p>
);
}
// Or using inline styles with Google Fonts link:
// <p style={{ fontFamily: '"Instrument Sans"' }}>Your text</p>Expo and React Native code for Instrument Sans
// Install: npx expo install @expo-google-fonts/instrument-sans expo-font
import { useFonts, Instrument_Sans_400Regular } from '@expo-google-fonts/instrument-sans';
export default function App() {
const [fontsLoaded] = useFonts({
Instrument_Sans_400Regular,
});
if (!fontsLoaded) return null;
return (
<Text style={{ fontFamily: 'Instrument_Sans_400Regular' }}>
Your text here
</Text>
);
}