Skip to content

Amount

Every balance, delta, and fee readout is one component: mono + tabular-nums always, crypto or fiat leading with the rolling-digits flip, signed success/danger tones, a sign-less muted zero, and blurred-dot privacy masking.

Primary mode

The same holding with crypto or fiat leading. Flipping mode animates both lines through the rolling-digits idiom.

crypto primary
1.4171BTC$164.74K
<AmountDisplay amount="1.41712345" symbol="BTC" fiat="$164,740.60" mode="crypto" size="lg" />
  • --ch-fg
  • --ch-fg-muted
  • --ch-font-family-mono

Default — the asset amount leads, fiat rides secondary.

fiat primary
$164.74K1.4171BTC
<AmountDisplay amount="1.41712345" symbol="BTC" fiat="$164,740.60" mode="fiat" size="lg" />
  • --ch-fg
  • --ch-fg-muted
  • --ch-fg-faint

Fiat leads for spending contexts; the crypto line keeps the ticker in faint.

Signed tones and zero

Receive renders positive (success, plus sign), send renders negative (danger, minus sign). Zero drops the sign and mutes — an empty wallet is calm, not alarming.

default
1.4171BTC$164.74K
<AmountDisplay amount="1.41712345" symbol="BTC" fiat="$164,740.60" />
  • --ch-fg
  • --ch-fg-muted

Unsigned — balances and quotes.

positive
+0.65BTC+$75,563
<AmountDisplay amount="0.65000000" symbol="BTC" fiat="$75,562.50" tone="positive" />
  • --ch-success
  • --ch-fg-muted

Incoming — success tone, plus sign on both lines.

negative
−0.035BTC−$4,068.8
<AmountDisplay amount="0.03500000" symbol="BTC" fiat="$4,068.75" tone="negative" />
  • --ch-danger
  • --ch-fg-muted

Outgoing — danger tone, true minus sign (−, not hyphen).

zero
0BTC$0
<AmountDisplay amount="0.00000000" symbol="BTC" fiat="$0.00" tone="positive" />
  • --ch-fg-muted

Sign-less and muted even with a tone set — nothing moved.

Privacy masking

Privacy replaces both values with blurred dots, announces “Amount hidden” to screen readers, and neutralizes tone — a masked amount leaks nothing, not even direction.

privacy off
1.4171BTC$164.74K
<AmountDisplay amount="1.41712345" symbol="BTC" fiat="$164,740.60" />
  • --ch-fg
  • --ch-fg-muted

Full readout.

privacy on
Amount hidden
<AmountDisplay amount="1.41712345" symbol="BTC" fiat="$164,740.60" privacy />
  • --ch-fg-muted

Blurred dots on both lines; sign suppressed.

privacy on · fiat primary
Amount hidden
<AmountDisplay amount="1.41712345" symbol="BTC" fiat="$164,740.60" mode="fiat" privacy />
  • --ch-fg-muted

Masking is mode-independent.

Sizes

sm rides transaction rows, md is the working default, lg heads detail panels, xl is reserved for the portfolio total.

sm
+0.65BTC+$75,563
<AmountDisplay size="sm" … />
  • --ch-font-size-sm

Transaction rows, tables.

md
+0.65BTC+$75,563
<AmountDisplay size="md" … />
  • --ch-font-size-xl

Default — cards, list headers.

lg
+0.65BTC+$75,563
<AmountDisplay size="lg" … />
  • --ch-font-size-3xl

Detail panel headline.

xl
+0.65BTC+$75,563
<AmountDisplay size="xl" … />
  • --ch-font-size-5xl

Portfolio total only.

Across themes

The lg positive readout under dark, light, and Harbor Mode — the success tone holds AA on every layer.

+0.65BTC+$75,563
<AmountDisplay amount="0.65000000" symbol="BTC" fiat="$75,562.50" tone="positive" size="lg" />
  • --ch-success
  • --ch-fg-muted
  • --ch-font-family-mono