---
title: Fonts
description: Makira and Paper Mono are the standard pair. Michelangelus, IBM Plex Mono, and Unbounded stay opt-in.
sidebar:
  label: Overview
  order: 1
---

The SHAUGHV type system is two versatile families, not a headline font plus a body font. Use either one for titles, display, interfaces, body copy, or buttons. Paper Mono also gives code and data a precise grid.

**[Makira](/fonts/makira)**

Standard sans. Weights 400–900, static and variable.

**[Paper Mono](/fonts/paper-mono)**

Standard mono. Weights 100–800, static and variable.

**[IBM Plex Mono](/fonts/opt-in)**

Optional quieter mono with italics.

**[Unbounded](/fonts/opt-in)**

Optional geometric display family.

**[Michelangelus](/fonts/michelangelus)**

Optional serif. Regular, Italic, Bold, and Bold Italic.

## Load the standard pair

```html HTML
<link rel="stylesheet" href="https://cdn.shaughv.com/fonts/fonts.css" />
```

```css CSS
@import url("https://cdn.shaughv.com/fonts/fonts.css");
```

That one file imports Makira and Paper Mono, plus Gail Rock for compatibility with existing sites. The live manifest records the preferred pair in `fonts.all.defaults`. It does **not** import Michelangelus, IBM Plex Mono, or Unbounded.

## Family names

| Family | Status | CSS family names | Weights |
| --- | --- | --- | --- |
| Makira | Standard | `"Makira"`, `"Makira VF"` | 400–900 |
| Paper Mono | Standard | `"Paper Mono"`, `"Paper Mono Variable"` | 100–800 |
| Gail Rock | Compatibility | `"Gail Rock"`, `"Gail Rock VF"` | 100–700 |
| Michelangelus | Opt-in | `"Michelangelus"` | 400 and 700, normal and italic |
| IBM Plex Mono | Opt-in | `"IBM Plex Mono"` | 100–700, italic |
| Unbounded | Opt-in | `"Unbounded"`, `"Unbounded Blond"`, `"Unbounded Variable"` | 300–900 + variable 100–900 |

## Side by side

The same sentence in both standard voices:

<div class="cdn-specimen">
  <span class="cdn-specimen-label">Makira</span>
  <p class="cdn-makira cdn-display">Ready for the whole interface.</p>
  <p class="cdn-makira cdn-body">Clear at reading sizes, forceful at display sizes, and comfortable on controls.</p>
</div>

<div class="cdn-specimen">
  <span class="cdn-specimen-label">Paper Mono</span>
  <p class="cdn-paper cdn-display">Ready for the whole interface.</p>
  <p class="cdn-paper cdn-body">Expressive at display sizes, readable in body copy, and precise for code and data.</p>
</div>

:::warning
Do not add another family to the standard bundle without an explicit brand decision. Opt-in stylesheets exist so a project can ask for a third voice on purpose.
:::

## Recommended CSS variables

```css
:root {
  --font-makira: "Makira", system-ui, sans-serif;
  --font-paper: "Paper Mono", ui-monospace, monospace;
  --font-mono-alt: "IBM Plex Mono", ui-monospace, monospace;
  --font-brutal: "Unbounded", system-ui, sans-serif;
}
```

The family pages include live weight controls. [Gail Rock](/fonts/gail-rock) also shows its alternate glyphs and display ligatures.

## Same interface, two voices

The content and layout stay the same so you can compare titles, reading text, labels, data, and controls. Either family can carry the whole interface.

<div class="cdn-role-grid">
  <section class="cdn-role-card cdn-makira" aria-label="Interface in Makira">
    <span class="cdn-specimen-label">Makira / sans</span>
    <h3>Your next idea starts here.</h3>
    <p>Bring clarity to the details. Build something useful, then give it a voice of its own.</p>
    <dl><div><dt>Assets</dt><dd>Ready to use</dd></div><div><dt>Delivery</dt><dd>Global CDN</dd></div></dl>
    <a href="/fonts/makira">Explore Makira</a>
  </section>
  <section class="cdn-role-card cdn-paper" aria-label="Interface in Paper Mono">
    <span class="cdn-specimen-label">Paper Mono / mono</span>
    <h3>Your next idea starts here.</h3>
    <p>Bring clarity to the details. Build something useful, then give it a voice of its own.</p>
    <dl><div><dt>Assets</dt><dd>Ready to use</dd></div><div><dt>Delivery</dt><dd>Global CDN</dd></div></dl>
    <a href="/fonts/paper-mono">Explore Paper Mono</a>
  </section>
</div>

## Try the standard families

### Makira variable

<FontPlayground family="Makira" />

### Paper Mono variable

<FontPlayground family="Paper Mono" />
