---
title: "How to format numbers in React app?"
description: "Learn how to properly format numbers in your React application for different languages and locales using the built-in JavaScript Intl object. Ensure your app is user-friendly and accessible for all with accurate number formatting."
category: react
date: 2023-03-17
updated: 2026-10-09
canonical: https://localizely.com/i18n-questions/react/how-to-format-numbers-in-react-app/
---

# How to format numbers in React app?

When developing a React application that supports multiple languages, it's essential to consider how numbers are formatted in different locales. In some languages, decimal numbers are separated with dots, while in others, commas are used. This can lead to confusion for users if the formatting is not done correctly.

To ensure proper localization of the app, it's important to format numbers correctly. One way to achieve this is by using the built-in Javascript Intl object. This object provides a variety of options for formatting numbers, including currency and percentage formatting.

```javascript
let number = 123456.789;

let enFormatter = new Intl.NumberFormat('en-US', { style: 'decimal' });
console.log(enFormatter.format(number)); // 123,456.789

let deFormatter = new Intl.NumberFormat('de-DE', { style: 'decimal' });
console.log(deFormatter.format(number)); // 123.456,789
```

To learn more about formatting numbers using the JavaScript Intl object, you can check out [this article](/blog/javascript-intl-api/#formatting-numbers). Additionally, if you're interested in formatting numbers with the react-intl library, [this article](/blog/react-intl-tutorial/#react-intl-formatting-options-t0) may provide further insights.

Source: https://localizely.com/i18n-questions/react/how-to-format-numbers-in-react-app/