Name: Roboto Mono
Author: Christian Robertson

In Context

Roboto Mono Specimen Gallery

Code Editor

index.tsx

TypeScript ReactUTF-8

1import { useState, useEffect } from 'react';
2
3interface UserProfile {
4  id: string;
5  name: string;
6  email: string;
7  avatar?: string;
8}
9
10export function UserCard({ user }: { user: UserProfile }) {
11  const [isLoading, setIsLoading] = useState(false);
12
13  return (
14    <div className="card">
15      <img src={user.avatar} alt={user.name} />
16      <h2>{user.name}</h2>
17      <p>{user.email}</p>
18    </div>
19  );
20}

Ln 15, Col 28Spaces: 2
TypeScript JSXPrettier

Code Editor

Syntax highlighted code block

Quick Start

Roboto Mono Implementation Guide

HTML Link Tag

Add to your <head> section

<link href="https://fonts.bunny.net/css?family=Roboto+Mono:400,700&display=swap" rel="stylesheet">

CSS @import

Add at top of your stylesheet

@import url('https://fonts.bunny.net/css?family=Roboto+Mono:400,700&display=swap');

CSS @font-face

Self-host the font files

@font-face {
  font-family: 'Roboto Mono';
  src: url('https://fonts.google.com/specimen/Roboto+Mono');
  font-display: swap;
}

Implementation

Roboto Mono CSS Implementation

Standard CSS

css

Apply directly to any CSS class or selector.

 1.my-text {
 2  font-family: 'Roboto Mono', sans-serif;
 3  font-weight: 400;
 4}

SCSS Variable

scss

Define once, use throughout your stylesheet.

 1$font-primary: 'Roboto Mono', sans-serif;
 2
 3.my-text {
 4  font-family: $font-primary;
 5}

Tailwind CSS

config

Configure once, apply with utility classes.

 1// tailwind.config.js
 2module.exports = {
 3  theme: {
 4    extend: {
 5      fontFamily: {
 6        'roboto-mono': ['Roboto Mono', 'sans-serif'],
 7      },
 8    },
 9  },
10}
11
12// Usage in HTML
13<p class="font-roboto-mono">Your text here</p>

About

Inside Roboto Mono

Christian Robertson

Monospace

Open Source

Roboto Mono presents bold serifs and confident character, making it well-suited for programming environments. Its code-friendly design and uniform character width contribute to its versatile character. Particularly effective for terminal interfaces and technical documentation, Roboto Mono adapts confidently across design contexts. Extended language coverage includes Roboto Mono supports a wide range of languages, including Latin, Greek, and Cyrillic scripts, making....

Roboto Mono comes from the work of Christian Robertson at Google. The typeface's fixed-width and slab-serif details reflect a design philosophy optimized for 2010s material design, adopted for Google Material Design code blocks.

As a Monospaced sans-serif in the Vox-ATypI Mechanistic Lineal family, Roboto Mono monospaced variant of the Roboto family. Its equal advance width for every glyph and exaggerated serifs or strokes to fill the fixed-pitch cell make it a strong fit for source code editors and terminal emulators.

Roboto Mono is available in a single weight, offering focused typographic consistency across digital and print workflows, with 3 font pairings curated. Extended language support spanning Cyrillic, Greek, and Latin Extended ensures reliable rendering across global audiences. Roboto Mono also serves as a free alternative to premium typefaces, offering comparable typographic quality under open licensing.

Roboto Mono

Overview

About Roboto Mono

Roboto Mono embodies the Monospaced sans-serif in the Vox-ATypI Mechanistic Lineal family, designed during the 2010s material design era. Built with fixed-width and slab-serif details, Roboto Mono serves as a standard typeface for source code editors and terminal emulators, with notable adoption in Google Material Design code blocks. TypeSmith indexes Roboto Mono in a single weight variant and 3 curated font pairings. Roboto Mono also serves as a verified free alternative to premium typefaces.

Font Pairings Available

3 curated pairings for Roboto Mono

View Pairings

Explore More

Fonts Similar to Roboto Mono

View all fonts

TypeSmith identifies 5 fonts with similar visual characteristics to Roboto Mono based on classification, x-height ratio, and stroke weight. These alternatives maintain the same typographic personality while offering different weight options and language support.

Material Symbols Outlined

Monospace

Inclusive Design

Accessibility & Usability

90

Accessibility Score

Excellent Accessibility

Using Roboto Mono Accessibly

Roboto Mono scores in the excellent accessibility tier, making it well-suited for body text, UI labels, and long-form reading across devices. Good monospace fonts clearly distinguish similar glyphs (0/O, 1/l/I). Ligatures should be optional, as they can impair character-by-character reading for screen readers.

Reading Roboto Mono: Legibility Factors

Roboto Mono draws legibility from its equal advance width for every glyph and exaggerated serifs or strokes to fill the fixed-pitch cell. These characteristics help readers distinguish similar glyphs such as I, l, and 1 at a range of sizes.

Roboto Mono in Context: Readability

Optimized for character-level scanning rather than word-shape recognition. Readability depends on distinct glyph differentiation and consistent vertical alignment across all characters. Use at 16 px minimum for body text, and maintain 1.5 line-height to support comfortable reading rhythm.

Eye Strain Considerations for Roboto Mono

Roboto Mono provides a focused weight range that maintains consistent typographic color across paragraphs. Balanced stroke modulation keeps visual noise low during sustained reading sessions.

Roboto Mono Accessibility Recommendations

Maintain a minimum contrast ratio of 4.5:1 for body text and 3:1 for large text when setting Roboto Mono. Use font sizes of at least 16 px for paragraph copy and line spacing of 1.5 or greater. When Roboto Mono glyphs convey meaning, provide aria-label text for screen reader compatibility.

Working with Roboto Mono: Best Practices

Pair with a humanist or geometric sans-serif for UI chrome around code blocks. Avoid combining two monospace faces on the same page. A focused set of pairings helps designers find compatible companions for Roboto Mono. Establish hierarchy through size, spacing, and color rather than multiplying font families. Serve Roboto Mono in WOFF2 format with its extended character set to ensure consistent rendering across global audiences.

Get the Font

Available Weights & Styles

Available on Google Fonts

4 weights available for download

Download

Available Weights

400

Regular

400

Regular Italic

700

Bold

700

Bold Italic

Weight Reference

Aa

100

Aa

200

Aa

300

Aa

400

Aa

500

Aa

600

Aa

700

Aa

800

Aa

900

Internationalization

Language Support

Extended Latin Coverage

Supports 100+ languages with Latin script

Western European

English
French
German
Spanish
Italian
Portuguese
Dutch

Nordic

Swedish
Norwegian
Danish
Finnish
Icelandic

Central European

Polish
Czech
Hungarian
Romanian
Slovak

Baltic

Lithuanian
Latvian
Estonian

Roboto Mono supports a wide range of languages, including Latin, Greek, and Cyrillic scripts, making it versatile for global use in programming, design, and documentation.

Legal

Roboto Mono License Information

SIL Open Font License (OFL) 1.1

Free for personal and commercial use

View License

What you can do

Personal projects
Commercial projects
Web embedding
App embedding
Modification
Redistribution

Restrictions

Selling as standalone

Modified versions must use a different name and be distributed under the same OFL license.

Roboto Mono is available under the SIL Open Font License (OFL), Version 1.1. This license is a free, libre, and open source license specifically designed for fonts and related software. The OFL allows the fonts to be used, studied, modified, and redistributed freely as long as they are not sold by themselves. This makes Roboto Mono ideal for web projects, applications, documents, and print materials of any kind.

Element	Weight	Size	Line Height	Tracking	Preview
Body Text	Regular	16px	24px	0.5px	Roboto Mono delivers excellent readability for body copy
Italicized	Regular Italic	16px	24px	0.5px	Roboto Mono italic provides elegant emphasis
Bold	Bold	16px	24px	0.5px	Roboto Mono bold creates strong visual hierarchy
Small Caps	Regular	16px	24px	0.5px	Roboto Mono typography specimen
Secondary Text	Medium	14px	20px	0.5px	Roboto Mono typography specimen

Roboto Mono

Best Ways to Use Roboto Mono

Best Font Pairings for Roboto Mono

Test Roboto Mono Font Pairings Live

Roboto Mono Is a Free Alternative To

Roboto Mono is recommended for 2 use cases

Recommendation Lists

Top 10 Monospace Fonts

Top 10 Accessible Monospace Fonts

Top 10 VS Code Fonts

Top 10 Coding Fonts

Top 10 Terminal Fonts

In Context

Character Set

Type Scale

Roboto Mono Body Typography

Quick Start

HTML Link Tag

CSS @import

CSS @font-face

Implementation

Standard CSS

SCSS Variable

Tailwind CSS

About

Typography Judgment

Classification

Accessibility

Design Heritage

Overview

Categories

Explore More

Inclusive Design

Using Roboto Mono Accessibly

Reading Roboto Mono: Legibility Factors

Roboto Mono in Context: Readability

Eye Strain Considerations for Roboto Mono

Roboto Mono Accessibility Recommendations

Working with Roboto Mono: Best Practices

Get the Font

Available Weights

Weight Reference

Internationalization

Western European

Nordic

Central European

Baltic

Legal

What you can do

Restrictions