DefaultCurrencyPercentUnitNotationSignDisplayFractionDigitsLocaleNumberAttribute
<nve-format-number>1234567.89</nve-format-number>
1234567.89
Edit Example
A localized number formatter for currencies, percentages, units, and compact notation, backed by Intl.NumberFormat.
Provide a currency attribute when formatStyle is currency, and a unit attribute when formatStyle is unit.
<div nve-layout="column gap:sm">
<nve-format-number format-style="currency" currency="USD">1234.56</nve-format-number>
<nve-format-number format-style="currency" currency="EUR" currency-display="code">1234.56</nve-format-number>
<nve-format-number format-style="currency" currency="JPY" currency-display="name">1234</nve-format-number>
</div>
Edit Example
ISO 4217 currency code (such as USD or EUR). Required when formatStyle is currency.
Currency Description string default
<div nve-layout="column gap:sm">
<nve-format-number format-style="percent">0.85</nve-format-number>
<nve-format-number format-style="percent">0.126</nve-format-number>
</div>
Edit Example
Percent formatting for ratios and completion values. Source values should already represent a fraction (such as 0.85 for 85 percent).
<div nve-layout="column gap:sm">
<nve-format-number format-style="unit" unit="kilometer">1234.56</nve-format-number>
<nve-format-number format-style="unit" unit="byte" unit-display="long">2048</nve-format-number>
<nve-format-number format-style="unit" unit="celsius" unit-display="narrow">22</nve-format-number>
</div>
Edit Example
Unit identifier (such as kilometer or byte). Required when formatStyle is unit.
Unit Description string default
<div nve-layout="column gap:sm">
<nve-format-number notation="compact" compact-display="short">1234567</nve-format-number>
<nve-format-number notation="compact" compact-display="long">1234567</nve-format-number>
<nve-format-number notation="scientific">1234567</nve-format-number>
<nve-format-number notation="engineering">1234567</nve-format-number>
</div>
1234567
1234567
1234567
1234567
Edit Example
Number notation: 'standard' | 'scientific' | 'engineering' | 'compact'.
Notation Description standard scientific engineering compact
<div nve-layout="column gap:sm">
<nve-format-number sign-display="always">42</nve-format-number>
<nve-format-number sign-display="always">-42</nve-format-number>
<nve-format-number sign-display="exceptZero">0</nve-format-number>
<nve-format-number sign-display="never">-42</nve-format-number>
</div>
Edit Example
Sign display: 'auto' | 'never' | 'always' | 'exceptZero'.
SignDisplay Description auto never always exceptZero
<div nve-layout="column gap:sm">
<nve-format-number minimum-fraction-digits="4">1.5</nve-format-number>
<nve-format-number maximum-fraction-digits="0">1.567</nve-format-number>
<nve-format-number minimum-fraction-digits="2" maximum-fraction-digits="2">3</nve-format-number>
</div>
Edit Example
Fraction digit control for tuning decimal precision. Use to enforce fixed decimal places in financial or scientific contexts.
<div nve-layout="column gap:sm">
<nve-format-number locale="de-DE" format-style="currency" currency="EUR">1234.56</nve-format-number>
<nve-format-number locale="ja-JP" format-style="currency" currency="JPY">1234</nve-format-number>
<nve-format-number locale="fr-FR">1234567.89</nve-format-number>
</div>
Edit Example
Language tag (such as en-US, de-DE). Defaults to document.documentElement.lang or browser default.
Locale Description string default
<nve-format-number number="1234.56" format-style="currency" currency="USD"></nve-format-number>
Edit Example
Number attribute input for values supplied by JavaScript or bound data. By default, the component formats text content, which also serves as the SSR fallback, and number wins when both are present.