Audit Typography

Review typography consistency and usability.

When to Use

• After adding new text elements
• Checking readability
• Ensuring token adherence

Approach

Step 1: Project Invariants (Required)

Before auditing, check docs/knowledge-base/ for project-specific constraints:

• SPEC-CSS.md — typography token mandates
• RULES-UI.md — typography rules (e.g., weight limits, font prohibitions)
• Flag any violation of documented invariants as Critical priority.

Step 2: Focus Areas

• Font Sizes: Consistent use of var(--font-size-*) tokens
• Font Weights: Appropriate use of var(--font-weight-*) tokens
• Line Height: Readable line heights
• Hierarchy: Clear visual hierarchy (H1 > H2 > H3 > body)
• Number Sets: Lining figures for UI, oldstyle for body (if applicable)

Checklist

• All font sizes use tokens
• Font weights follow hierarchy guidelines
• Line heights appropriate for content type
• Headings have clear visual distinction
• No hardcoded font values

Output

Findings report with specific file:line citations.