> For the complete documentation index, see [llms.txt](https://docs.webexp.dev/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.webexp.dev/supra-shopify-theme/supra/theme-settings/typography.md).

# Typography

Body and heading size.

SUPRA ships monospace throughout — Courier Prime, bundled with the theme so it renders identically on every device rather than picking up whatever Courier a visitor happens to have installed. That is the default and it needs no setting up.

If you want something else, **Font** offers three routes:

| Route                   | What it does                                                                                                                                                                                               |
| ----------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Theme default**       | Courier Prime, bundled. What ships.                                                                                                                                                                        |
| **Choose from Shopify** | Shopify's own font library through the picker, with body and heading chosen separately. Filter it to **Mono** if you want to keep the theme's character — SUPRA's layout is drawn around a monospace face. |
| **Custom font**         | Upload a `.woff2` under **Content → Files**, then paste its link and give it a name. Body and heading again separate; leave the heading fields empty and headings take the body face.                      |

Licensing a face for web use is between you and whoever made it — the theme can't check it for you.

The boxed wordmark is deliberately not affected. It's set in its own face because the box logo is the one thing that makes the theme recognisable at a glance.

| Setting               | Default | Notes                            |
| --------------------- | ------- | -------------------------------- |
| **Base font size**    | 12px    | Everything that is not a heading |
| **Heading font size** | 14px    | Section headings                 |

## Why the sizes are small

The reference layout this theme follows sets almost everything at 11–13px. Monospace runs wider than a proportional face at the same size, so 12px monospace occupies roughly the space of 14px in a normal sans. Pushing these up past 14 and 16 starts breaking layouts that are built around a fixed 874px column — the cart's price cells and the product page's buy row are the first to go.

## What is not affected

The boxed wordmark keeps its own face whatever you pick here — see [Branding](/supra-shopify-theme/supra/theme-settings/branding.md).