Explain Codes LogoExplain Codes Logo

With a browser, how do I know which decimal separator the operating system uses?

javascript
cross-browser-compatibility
locale-preferences
decimal-separator
Nikita BarsukovbyNikita Barsukov·Mar 14, 2025
TLDR

Want a quick hack to identify the OS's decimal separator? Use the Intl.NumberFormat with navigator.language. Get a load of this efficient snippet:

let decimalSeparator = (new Intl.NumberFormat(navigator.language)).format(1.1).charAt(1);

The trick here is formatting a number and pulling the second character, which happens to be our decimal separator. Neat, huh?

Ensuring compatibility and accuracy

Okay, we've got our fast answer, but what about cross-browser compatibility and user locale preferences? Let's dive deeper.

Test across browsers and OS

Although Intl.NumberFormat is pretty robust, we need to cut the red wire or the blue wire – or was it the green wire? The point is, make sure to test it across different browsers and OS. Use caniuse.com as a starting point and consider a polyfill for older browsers, because no one likes a 404 party.

Handle custom and uncommon separators

Not all heroes wear capes and not all users stick to the default decimal separator. Some have a custom setting. We need to give these outliers some love, so test and consider these scenarios. Maybe even let Chuck Norris personally input his decimal separator as an override option.

User preferences and default fallback

Fact: choose your decimal separator carefully in Russia; a mistake might end up summoning a bear. Always consider user preferences as vital - particularly in sensitive applications like government forms. Provide a default fallback separator that caters to most of your users.

Localization-focused detection and output

While our fast answer is pretty quick, there's another power tool if you're into fine details, Intl.NumberFormat#formatToParts. It's like season two of your favorite show, worth the wait and full of surprises!

Find them separators!

function getDecimalSeparator(locale) { const parts = new Intl.NumberFormat(locale).formatToParts(1234.5); const separator = parts.find(part => part.type === 'decimal').value; return separator; } console.log(getDecimalSeparator(navigator.language)); // Will it ',' or '.'? The suspense is killing me!

Each part in the array is a piece of the whole number. Find the decimal part, and boom! You have your raw symbol.

Show me the separator!

A shiny new function that only you use is as good as a secret, reveal it to users for confirmation. Display the decided separator, maybe next to a box where users can override it. This approach humanizes the experience and lets users feel in control—win-win!

Cross-check and Stay accurate

The devil's in the details especially when it comes to data precision. Confirm the detected separator aligns with the system's setting. Thorough testing will save you more times than Ctrl+S, so ensure your app links arms with different browsers and operating systems perfectly.