Monospace

A monospace typeface (also called a fixed-width or fixed-pitch font) is one where every character occupies exactly the same horizontal width. An 'i' takes up the same space as a 'W'. A period takes up the same space as an 'M'. This uniformity, which would be a liability in regular text typography, is precisely the feature that makes monospace fonts ideal for code, terminal output, and tabular data.

The monospace convention originated with typewriters, where mechanical constraints required all characters to share a single width. When computer terminals inherited this constraint, monospace became inseparable from code — and the aesthetic stuck even after technology removed the limitation. Today, monospace coding fonts are sophisticated designs, not technical compromises.

/* Primary monospace use case: code blocks */
code, pre, kbd, samp {
  font-family: 'JetBrains Mono', 'Fira Code', 'Source Code Pro',
    Consolas, 'Courier New', monospace;
  font-size: 0.875em; /* Monospace fonts often appear larger than same-size sans */
}

/* Tabular data — monospace ensures column alignment */
.data-table td {
  font-family: 'JetBrains Mono', monospace;
  font-variant-numeric: tabular-nums; /* Also works with proportional fonts */
}

/* Terminal-style display */
.terminal {
  font-family: 'Source Code Pro', monospace;
  background: #1e1e1e;
  color: #d4d4d4;
  padding: 1rem;
  white-space: pre;
}

Modern coding fonts like JetBrains Mono, Fira Code, and Source Code Pro add considerable sophistication to the traditional monospace format: programming ligatures that merge ->, =>, !=, and <= into unified symbols; carefully optimized hinting for rendering at small display sizes; and extensive weights from thin to bold for code syntax highlighting.

Monospace fonts are technically proportional fonts would handle with font-variant-numeric: tabular-nums — but monospace goes further by making every character (not just numerals) fixed-width, which is essential for vertically aligning code operators, indentation, and multi-line string patterns. It's also why white-space: pre and monospace are almost always used together.