Skip to main content

​
Usage guidelines

Follow Anvil2 guidance on casing, alignment, and color/contrast. Use AI Kit tokens consistently across all typography to maintain a cohesive type system.

​
Type ramp

Use AI Kit tokens consistently across all typography to maintain a cohesive type system. Headline styles should follow the same sizing and font-weight conventions established in Anvil2 to ensure consistency across experiences.

​
Type pairing guidance

Pair each headline level with its matching body size to keep hierarchy consistent across the product: a bigger headline earns a bigger supporting line, a smaller one stays compact.

​
Do’s and don’ts

​
Casing

Use title case for headlines and titles, and sentence case for body copy. Rely on A2 Typography rules for casing.

​
Alignment

Left-align body copy and headlines by default. Center only for short, standalone copy (empty states, single-line confirmations, modal titles). Right-align only for RTL locales or short supporting notes next to a left-aligned label — never a full paragraph. Baseline-align label/value pairs within a row or card.

​
Color and contrast

Standard text must meet a 4.5:1 contrast ratio against its background. Large text (18.5px+ bold, or 24px+ regular) must meet 3:1. Check secondary/tertiary grays against both white and dark surfaces before shipping — lighter grays used below 12px are the highest-risk combination.

​
Weight matrix

Sofia Pro: Bold (700) only, across all headline sizes (Extra-Large, Large, Medium, Small; page title remains Sofia Bold). Inter: Regular (body copy), Medium (Eyebrow only), Semibold (emphasis) — no Bold anywhere in either family.
Last modified on August 24, 2026