Primitives that know what money is.
Money
Minor-unit integers plus a currency code. Never a float, never toFixed(2). Decimals resolve from the currency, so JPY has none and KWD has three.
USD, 2 decimals
1,240 US Dollar and 56 centsJPY, 0 decimals
1,240,560 Japanese YenKWD, 3 decimals
1,240 Kuwaiti Dinar and 560 minor unitsAccounting negative (statements, tables)
negative 1,240 US Dollar and 56 centsDelta negative (U+2212, never a hyphen)
negative 1,240 US Dollar and 56 centsbigint amount
90,071,992,547,409 US Dollar and 92 centsNegative zero renders as zero
0 US DollarMixed currency: the code on every row
1,200 EuroConverted — a derived value, marked (hover for the basis)
approximately 1,304 US Dollar and 12 centsZero, null, n/a, redacted, loading
Five distinct renders, never value ?? 0. Rendering $0.00 for a value you don't have is a lie, and in a financial product it's the kind that costs money.
True zero, in a table
0 US DollarTrue zero, in a statement
zeroUnknown — we don't have it
not availableRedacted — we have it, you can't see it
hiddenLoading
The paren column
In a right-aligned column mixing 1,234.00 and (1,234.00), the closing paren shifts the digits left and destroys decimal alignment. An invisible ) is rendered on every positive value to reserve the slot.
Lopifi — reserved paren column, tnum, case
| Product revenue | 482,100 US Dollar |
|---|---|
| Services revenue | 118,400 US Dollar |
| Sales credits | negative 3,900 US Dollar |
| Refunds | negative 12,040 US Dollar and 56 cents |
| Rounding | zero |
| Deferred (unknown) | not available |
| Net revenue | 584,559 US Dollar and 44 cents |
What most kits ship — proportional figures, hyphen minus, no paren slot
| Product revenue | $482,100.00 |
|---|---|
| Services revenue | $118,400.00 |
| Sales credits | -$3,900.00 |
| Refunds | -$12,040.56 |
| Rounding | $0.00 |
| Deferred (unknown) | $0.00 |
The null row silently became $0.00, and the decimal points drift.
Delta
Polarity is the whole point. The same +$8,200 is good news for cash and bad news for burn, and the component is told which. Colour is never the only signal — try the greyscale toggle above.
polarity="standard" — revenue up
12,400 US Dollar+5.3 percentvs. Augpolarity="inverted" — burn up
8,200 US Dollar+8.1 percentvs. Augpolarity="inverted" — burn down
negative 4,200 US Dollarnegative 4.2 percentvs. AugZero delta — an em dash, not +0.0%
unchangedvs. AugPercent
A margin moving 20% → 25% rose 5 percentage points and 25% relative. Both are correct and they are different numbers, so the discriminator is required — there is no default kind.
kind: "relative"
+25.0 percentkind: "points"
+5.0 percentage pointskind: "bps" — under 1pp
+25 basis pointskind: "rate" — 3dp, trailing zeros kept
4.250 percentDivision by zero — never Infinity
not availableRule
Four centuries of accounting typography in two CSS declarations. A single rule above a subtotal, a 3px double rule below a grand total — spanning the numeric column only, which is what makes it read as accounting rather than as a divider.
| Product | 482,100 US Dollar |
|---|---|
| Services | 118,400 US Dollar |
| Total revenue | 600,500 US Dollar |
| Total expenses | negative 457,620 US Dollar |
| Net income | 142,880 US Dollar |
Figure
A number never truncates. Past a character threshold the figure steps down a whole type token — 40 → 28 → 20 — so it always lands on the scale rather than between two sizes.
hero, 8 characters
hero, 12 characters — steps to lg
hero, 16 characters — steps to md
Display — only where provably solitary
StatusPill
Tint background, coloured text, never a saturated fill. Icon and text always — an icon alone is not a status, and the accessible name carries the entity.
Sparkline · Trend
An impression, not a chart. It draws once on scroll-into-view and never on data change. There is no scrub — if a user needs values, they need MoneyChart.
Net direction up
Net direction down
Trend — Delta and Sparkline composed
AsOf
A balance without a timestamp is a rumour. Relative under an hour, absolute beyond, timezone always stated — and driven by one shared interval that pauses on tab hide, not forty setIntervals.
Two minutes ago
Beyond an hour — absolute, with the zone
With a prefix
Redacted · Reference
Redaction is a presentation state, not missing data — the blur keeps layout stable and user-select off. A reference uses zero and ss02 so a 0 isn't an O when someone transcribes it, and copy takes the raw value.
Blur, layout-stable, reveal on action
Reference — truncates in the middle
txn_8a2f…e6f7Account — last four only
account ending 4291Currency badge — code always, flag optional
EntityMark
The full fallback ladder — provided, then a deterministic monogram, then a category icon. Never a broken image.