Typography
Three font families optimized for their context: sans-serif for UI, monospace for code, and Courier Prime for industry-standard screenplay formatting.
Font Families
Each family serves a distinct purpose in the application.
The quick brown fox jumps over the lazy dog
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789
Geist Sans — UI text, navigation, metadata, and controls. Variable weight 100–900. Optimized for screen readability at small sizes.
The quick brown fox jumps over the lazy dog
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789
Geist Mono — Code blocks, technical identifiers, token values, commit hashes, and diff content.
The quick brown fox jumps over the lazy dog
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789
Courier Prime — Screenplay content. Industry standard: 12pt Courier = 1 page per minute of screen time. Falls back to Courier New, then system monospace.
Type Scale
7-step scale from xs (12px) to 2xl (24px). Base size is 14px — optimized for dense IDE interfaces.
The quick brown fox jumps over the lazy dog
0.75rem / 12pxThe quick brown fox jumps over the lazy dog
0.8125rem / 13pxThe quick brown fox jumps over the lazy dog
0.875rem / 14pxThe quick brown fox jumps over the lazy dog
1rem / 16pxThe quick brown fox jumps over the lazy dog
1.125rem / 18pxThe quick brown fox jumps over the lazy dog
1.25rem / 20pxThe quick brown fox jumps over the lazy dog
1.5rem / 24pxFont Weights
Four weight steps for establishing visual hierarchy.
Normal — The quick brown fox
Medium — The quick brown fox
Semibold — The quick brown fox
Bold — The quick brown fox
Information Hierarchy
Typography combined with color creates clear visual hierarchy. Labels recede, values stand out.
Correct
Alt ending — happy
3 minutes ago
12,847
Incorrect
Alt ending — happy
3 minutes ago
12,847
Line Heights
Four line-height values. Screenplay uses 1.0 (single spacing) per WGA standard.
Writers are the most important people in Hollywood, but we must never tell the writers that. The role of AI is not to replace the writer but to amplify the writer's voice.
Writers are the most important people in Hollywood, but we must never tell the writers that. The role of AI is not to replace the writer but to amplify the writer's voice.
Writers are the most important people in Hollywood, but we must never tell the writers that. The role of AI is not to replace the writer but to amplify the writer's voice.
Writers are the most important people in Hollywood, but we must never tell the writers that. The role of AI is not to replace the writer but to amplify the writer's voice.
Letter Spacing
Four tracking values for different typographic contexts.
Scene heading
Scene heading
Scene heading
Scene heading
Screenplay Elements
Industry-standard formatting with Courier Prime at 12pt, single-spaced. Each element type has its own color token.
INT. WRITER'S ROOM - DAY
The cursor blinks on an empty page. A coffee cup steams beside the keyboard, untouched for hours.
ALEX
(looking at the screen)
What if I told you the story writes itself? What if all we have to do is listen?
CUT TO:
[[Consider adding a beat here for emotional weight before the reveal.]]