Typography

The design system uses MS Sans Serif — the iconic Windows 95 system font — for all UI text, reinforcing the retro aesthetic.

---

Font family

Token	Value	Fallback
--fontfamily-primary	'MS Sans Serif'	sans-serif

MS Sans Serif is self-hosted from woff2/woff files (sourced from react95). It includes regular (400) and bold (700) weights.

---

Type scale

The scale uses raw pixel/rem values — there are no named size tokens. Components set their own sizes following these conventions:

Window & page headings

48px — Page title (h1)

PvP Design System

24px — Section heading (h2)

Component Overview

20px — Window title bar

Button Documentation

UI elements

16px — Sidebar section label

Components

14px — Navbar buttons, sidebar items, body

Apps

14px — Button text (default md)

Primary

12px — Button text (sm), metadata

Small Button

Secondary & metadata text

14px — Text input placeholder

Bill name

11px — Attribution, status labels

SYSTEM STATUS

---

Secondary typefaces

These are used outside the Win95 chrome for documentation content readability:

Usage	Font	Source
Markdown body (.markdown)	Inter	Google Fonts
Code blocks	Geist Mono / Fira Code	Monospace stack

Inter is only used inside the documentation content area — the Win95 shell, components, and all UI chrome use MS Sans Serif exclusively.

---

Usage guidelines

Do

• Use var(--fontfamily-primary) for all component text
• Use font-weight: 700 for bold emphasis — MS Sans Serif includes a bold weight
• Use line-height: normal or line-height: 16px for tight UI text

Don't

• Don't use font weights other than 400 or 700
• Don't mix MS Sans Serif with other display fonts in the UI chrome
• Don't use MS Sans Serif for long-form documentation content — use Inter instead

---

Changelog

Date	Change
2026-07-20	Replace chat-feature sample copy (Sage Willow removed) with non-chat examples
2026-03-27	Document typography tokens and type scale
2026-03-27	Switch from Jersey 25 to MS Sans Serif
2026-03-14	Set Jersey 25 as primary font family