Question 1

How does the relative time formatter pick the unit automatically?

Accepted Answer

We compute the signed difference in milliseconds, then walk the unit ladder (second → minute → hour → day → week → month → year) using configurable thresholds. By default: ≤45s is 'just now' (numeric:auto → 'now'), <90s uses seconds, <45min uses minutes, <22h uses hours, <7d uses days, <26d uses weeks, <11mo uses months, otherwise years. The result is passed to Intl.RelativeTimeFormat so pluralization, gender, and inflection are handled by CLDR.

Question 2

What is the difference between numeric 'always' and 'auto'?

Accepted Answer

Intl.RelativeTimeFormat accepts a numeric option. 'always' (default in the API) renders every value literally: format(0, 'second') → 'in 0 seconds'. 'auto' uses idiomatic phrasing where available: format(0, 'second') → 'now', format(-1, 'day') → 'yesterday' (en), 'ayer' (es), 'hier' (fr), 'gestern' (de), '昨日' (ja). This tool exposes both via a single toggle so you can preview the exact string each mode produces.

Question 3

Which locales are supported?

Accepted Answer

Five locales with full CLDR coverage are bundled: English (en), Spanish (es), French (fr), German (de), and Japanese (ja). The multi-locale preview grid renders your timestamp in all five at once so you can compare phrasing, plural rules, and 'yesterday'/'tomorrow' idioms side by side. The generated Intl snippet can be edited to use any BCP-47 tag (e.g. 'zh-CN', 'ar', 'pt-BR').

Question 4

Does the generated code snippet run as shown?

Accepted Answer

Yes. The Intl.RelativeTimeFormat snippet uses only the native browser API — no dependencies. The Luxon snippet requires luxon (DateTime.fromMillis(ts).toRelative({ locale })). The Day.js snippet requires dayjs plus the relativeTime plugin (dayjs(ts).fromNow()). The date-fns snippet requires date-fns and the matching locale object (formatDistance(ts, Date.now(), { addSuffix: true, locale })). All four are copy-paste runnable.

Question 5

What extra features does this tool have versus raw Intl.RelativeTimeFormat?

Accepted Answer

(1) Auto unit selection (the native API makes you pick). (2) Configurable thresholds (justNow, minute, hour, day, week, month, year cutoffs). (3) numeric 'always' vs 'auto' toggle. (4) Three style modes (long, short, narrow). (5) Multi-locale preview grid (5 locales at once). (6) Code snippet generator for 4 libraries. (7) Full breakdown table (years/months/weeks/days/hours/minutes/seconds totals). (8) Sample-date presets. (9) localStorage history (max 20). (10) Shareable URL with full option round-trip. (11) Future-vs-past direction indicator. (12) Copy / download as .txt. 100% client-side.

Relative Time (Time Ago) Formatter

Format options

Preview

Full breakdown

Code snippet

How to use

Format options

Preview

Full breakdown

Code snippet