Typography

Two faces, three tiers. General Sans sets headings, always at Semibold; Asap sets everything else. Every line height sits on the 8px grid.

Two faces

A geometric grotesk with drafting-room precision for headings, and a sturdy humanist sans for reading. Both are self-hosted from public/fonts, so there is no third-party request on first paint.

Tier 1 · Headings

--font-heading

General SansSemibold 600, always

Snowdon Towers Sample Structural

Foundry: Indian Type Foundry, via Fontshare
License: ITF Free Font License 2.0. Free for commercial use; self-hosting allowed. Not on Google Fonts.
File: GeneralSans-Variable.woff2
Axis: Weight 200–700, roman and italic
Sets: Page titles, section headings, card and list titles

Tiers 2 and 3 · Everything else

--font-sans

AsapRegular 400 to read, Medium 500 and Semibold 600 for controls

Send from Revit places the detail on the active sheet at its saved scale.

Foundry: Omnibus-Type, OFL
License: SIL Open Font License 1.1. Free to use, embed and self-host; the license text ships beside the files.
File: Asap-Variable.woff2
Axis: Weight 400–700, roman and italic
Sets: Body copy, ledes, controls, labels, metadata and figures

Type scale by role

Pick a style by what the text does, not by how big it should look. The classes live in src/styles/global.css; Display and Title step down below 768px so their line heights stay on the grid.

Role	Sample	Size / line	Weight	Use
Display`.type-display`	Rook Library	56/64 · 40/48 below 768px	600 · -0.03em	Landing heroes only
Title`.type-title`	Release notes	40/48 · 32/40 below 768px	600 · -0.03em	One per page: the h1
Section`.type-section`	Recent imports	22/32	600 · -0.02em	Section headings
Item`.type-item`	Beam to column connection	16/24	600 · -0.01em	Card and list titles
Lede`.type-lede`	Every detail, family and project your office has drawn.	18/32	400 · 0	The paragraph under a title
Body`.text-base`	Send from Revit places the detail on the active sheet at its saved scale.	16/24	400 · 0	Reading text
UI`.text-sm`	Send to Revit	14/24	600 · 0	Buttons, tabs, segmented items
Meta`.type-meta`	S-600 · 3" = 1'-0" · v2.3.1	13/16	500 · 0, tabular figures	Counts, dates, sheet numbers
Label`.type-label`	Recently added	12/16 capitals	600 · 0.08em	Small labels above titles, table headers

Rules

A short list, because the scale does most of the work.

Headings are always 600

General Sans has one job and one weight. Hierarchy comes from size and space, never from a lighter or heavier cut.

Level 3 framing600 · yes

Level 3 framing400 · no

Nothing above 700

Both variable axes stop at 700. Ask for more and the browser fakes it. In practice Asap runs 400 to 600.

Rook400

Rook500

Rook600

Rook700 · ceiling

Figures are tabular in metadata

Sheet numbers, scales, versions and dates line up in a column, so an engineer can scan them like a drawing index.

Beam to column connection
S-600 · 3" = 1'-0" · v2.3.1
Typical slab edge
S-511 · 1" = 1'-0" · v1.10.0
Moment frame base plate
S-702 · 1½" = 1'-0" · v2.0.4

Sentence case; capitals only for labels

Titles, buttons and menu items are sentence case. Spaced capitals belong to 12px labels and nothing else.

Rook Lateral · 2.3.1

Faster wind load takedowns

Released Oct 2, 2026