Design language
Typography
Plus Jakarta Sans headlines · Inter body · tabular-nums for money
Typography
| Role | Family | Notes |
|---|---|---|
| Headlines | Plus Jakarta Sans | 700 / 800 · tracking -0.02em |
| Body | Inter | Regular / SemiBold (SF Pro on native Apple UI where appropriate) |
| Money | Inter + tabular-nums | Align currency columns |
Loaded via next/font in the root layout (--font-display, --font-body).
Scale (live)
Interactive sliders preview display / headline / body / label sizes. Reset restores Design.md defaults.
Drag sliders to preview scale sizes. Defaults match Design.md tokens.
display-lg32px / 800
Receipt infrastructure
headline-lg24px / 700
Digital receipts, end to end
headline-md20px / 700
POS → consumer apps
body-lg17px / 400
E-FACTS connects point-of-sale events to shopper wallets with accuracy as the default.
body-md15px / 400
Default reading size for docs and product UI body copy.
body-sm13px / 400
Supporting detail, captions, and dense metadata.
label-md13px / 600
SECTION LABEL
label-sm11px / 600
META · STATUS
Financial figures
tabular-nums · financial
$1,240.50$98.00$12,480.75
Always use tabular-nums (or font-variant-numeric: tabular-nums) for currency and ledgers so columns align.