JetBrains Mono font

JetBrains 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

JetBrains Mono

Use in playground

JetBrains 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 JetBrains Mono

Body sample

Use JetBrains Mono in landing pages, dashboards, and DESIGN.md exports. Pair it with a complementary body font for readable paragraphs and UI labels.

Popular pairings

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=JetBrains+Mono:wght@400;500;600;700&display=swap" rel="stylesheet" />

CSS @import

css

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap');

body {
  font-family: 'JetBrains Mono', monospace;
}

CSS font-family

css

.font-jetbrains-mono {
  font-family: 'JetBrains Mono', monospace;
  font-weight: 400;
}

Next.js next/font/google

typescript

import { JetBrains_Mono } from "next/font/google";

const font = JetBrains_Mono({
  subsets: ["latin"],
  weight: ["400", "500", "600", "700"],
  variable: "--font-jetbrains-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-jetbrains-mono: 'JetBrains Mono', monospace;
}

/* Usage: class="font-[family-name:var(--font-jetbrains-mono)]" */

DESIGN.md snippet

markdown

## Typography

- **Headline font:** JetBrains Mono (Google Fonts)
- **CSS stack:** 'JetBrains Mono', monospace
- **Weights:** 400;500;600;700

```html
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap" rel="stylesheet" />
```

Best for

  • Code blocks
  • Developer docs
  • Terminal UI
  • API references