Format for Solid

FormatNumber for plain numbers, currency, percents and compact numbers, FormatByte for file sizes, and FormatRelativeTime for "3 hours ago". Each renders a span, so you can style it with a class like any text.

The default locale of the environment that renders it, through the Intl API. It does not take a locale prop. On a server that is the server's locale, in the browser the user's, so wrap it in your own component if you need to pin one.

FormatNumber takes the options of Intl.NumberFormat as props: style="currency" with currency="USD", style="percent", or notation="compact". The Currency, Percent and Compact demos show each.

1000 by default (unitSystem="decimal"). Set unitSystem="binary" to divide by 1024. The labels stay kilobyte, megabyte and so on, up to terabyte, and unitDisplay picks short, long or narrow.

No. It computes the distance from now each time it renders, in seconds, minutes, hours, days, months or years, and does not tick. Re-render it, for example from a timer, to refresh it. style picks long, short or narrow.

It can. The server and the browser each read their own clock and locale, so the text may differ between the HTML and the first client render. Render it after mount, for example inside ClientOnly, when the value is close to now.

Run the command in the Installation section on this page. One file, format, is added, with no dependency besides the platform's Intl API.