Format Numbers

Number formatting for different needs. finance, length, size, etc.

Copy the Format Numbers <script> and paste into the <head> of your page

<!-- [WebTricks by CodeRaccoons] - Format NumbersĀ -->
<script async src="https://cdn.jsdelivr.net/gh/TheCodeRaccoons/WebTricks@1/Dist/Functional/FormatNumbers.min.js" ></script>
<!-- [WebTricks by CodeRaccoons] - Format NumbersĀ -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/TheCodeRaccoons/WebTricks@1/Dist/Functional/FormatNumbers.min.js" ></script>
Copy Script

Required attributes

Optional
I want this element to show the formatted number.
Attribute to add
Name
wt-formatnumber-element
Value
number
Instructions

Assign this attribute to the element that contains the number to format.

How does it look?
Optional
I want this attribute to specify locales for formatting. (e.g., 'en-US').
Attribute to add
Name
wt-formatnumber-locales
Value
Instructions

Set this attribute to define the locale for formatting the number.

How does it look?
Optional
I want this attribute to specify the unit code.
Attribute to add
Name
wt-formatnumber-unit
Value
Instructions

Set this attribute to define the unit when formatting as unit style.

How does it look?
Optional
I want this attribute to set the formatting style (e.g., currency).
Attribute to add
Name
wt-formatnumber-style
Value
currency
Instructions

Set this attribute to specify the formatting style for the number.

Available options:
currency, decimal, percent, unit

How does it look?
Optional
I want this attribute to specify the currency code.
Attribute to add
Name
wt-formatnumber-currency
Value
CAD
Instructions

Set this attribute to define the currency when formatting as currency.

ā€

Eg, when using Canadian or us dollar this can be specified writing CAD or USD

How does it look?

Optional Attributes

No items found.

Working examples