IBM Plex Mono font
IBM Plex Mono is a Google Font monospace family, free for commercial use on Google Fonts. Built for code samples, developer docs, and technical brand kits.
Monospace · Google Fonts · Commercial free
IBM Plex Mono
IBM Plex Mono is a Google Font monospace family, free for commercial use on Google Fonts. Built for code samples, developer docs, and technical brand kits.
Weight 400
The quick brown fox
Weight 500
The quick brown fox
Weight 600
The quick brown fox
Weight 700
The quick brown fox
Character set
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789
Display sample
Build your brand kit with IBM Plex Mono
Body sample
Use IBM Plex Mono in landing pages, dashboards, and DESIGN.md exports. Pair it with a complementary body font for readable paragraphs and UI labels.
Embed code
Copy the snippet for your stack — same pattern as Google Fonts, ready for production sites and AI agent repos.
HTML link tag
html
<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=IBM+Plex+Mono:wght@400;500;600;700&display=swap" rel="stylesheet" />CSS @import
css
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600;700&display=swap');
body {
font-family: 'IBM Plex Mono', monospace;
}CSS font-family
css
.font-ibm-plex-mono {
font-family: 'IBM Plex Mono', monospace;
font-weight: 400;
}Next.js next/font/google
typescript
import { IBM_Plex_Mono } from "next/font/google";
const font = IBM_Plex_Mono({
subsets: ["latin"],
weight: ["400", "500", "600", "700"],
variable: "--font-ibm-plex-mono",
});
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html lang="en" className={font.variable}>
<body>{children}</body>
</html>
);
}Tailwind CSS
css
@import "tailwindcss";
@theme {
--font-ibm-plex-mono: 'IBM Plex Mono', monospace;
}
/* Usage: class="font-[family-name:var(--font-ibm-plex-mono)]" */DESIGN.md snippet
markdown
## Typography
- **Headline font:** IBM Plex Mono (Google Fonts)
- **CSS stack:** 'IBM Plex Mono', monospace
- **Weights:** 400;500;600;700
```html
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600;700&display=swap" rel="stylesheet" />
```Best for
- Code blocks
- Developer docs
- Terminal UI
- API references