Intl.DisplayNames API: Language, Region, Script, and Currency Names
Translate language, region, script, and currency names into any language using Intl.DisplayNames. Learn about supported types, style options, and fallback behavior for unknown codes.
Detailed Explanation
Intl.DisplayNames: Translating Identifiers to Human-Readable Names
Intl.DisplayNames converts language codes, region codes, script codes, and currency codes into localized display names.
Language Names
const en = new Intl.DisplayNames('en', { type: 'language' });
en.of('ja'); // "Japanese"
en.of('de'); // "German"
en.of('zh-Hans'); // "Simplified Chinese"
const ja = new Intl.DisplayNames('ja', { type: 'language' });
ja.of('en'); // "英語"
ja.of('fr'); // "フランス語"
ja.of('ja'); // "日本語"
Region Names
const en = new Intl.DisplayNames('en', { type: 'region' });
en.of('US'); // "United States"
en.of('JP'); // "Japan"
en.of('DE'); // "Germany"
const ja = new Intl.DisplayNames('ja', { type: 'region' });
ja.of('US'); // "アメリカ合衆国"
ja.of('JP'); // "日本"
ja.of('DE'); // "ドイツ"
Currency Names
const en = new Intl.DisplayNames('en', { type: 'currency' });
en.of('USD'); // "US Dollar"
en.of('EUR'); // "Euro"
en.of('JPY'); // "Japanese Yen"
en.of('BTC'); // "Bitcoin" (if supported)
const de = new Intl.DisplayNames('de', { type: 'currency' });
de.of('USD'); // "US-Dollar"
de.of('CHF'); // "Schweizer Franken"
Script Names
const en = new Intl.DisplayNames('en', { type: 'script' });
en.of('Latn'); // "Latin"
en.of('Arab'); // "Arabic"
en.of('Hans'); // "Simplified Han"
en.of('Jpan'); // "Japanese"
const ja = new Intl.DisplayNames('ja', { type: 'script' });
ja.of('Latn'); // "ラテン文字"
ja.of('Arab'); // "アラビア文字"
Style Options
new Intl.DisplayNames('en', { type: 'language', style: 'long' })
.of('en-US'); // "American English"
new Intl.DisplayNames('en', { type: 'language', style: 'short' })
.of('en-US'); // "US English"
new Intl.DisplayNames('en', { type: 'language', style: 'narrow' })
.of('en-US'); // "US English"
Fallback Behavior
const dn = new Intl.DisplayNames('en', {
type: 'region',
fallback: 'code', // or 'none'
});
dn.of('ZZ'); // "ZZ" (fallback: 'code') or undefined (fallback: 'none')
Use Case
DisplayNames is invaluable for building locale/language pickers, currency selectors, and region dropdowns that display names in the user's language. A settings page showing 'Language: Japanese' to an English user should show 'Language: 日本語' to a Japanese user. A currency selector needs to show 'US Dollar' in English and 'US-Dollar' in German. Using Intl.DisplayNames eliminates the need to maintain static translation tables for these identifiers.
Try It — Locale String Tester
Related Topics
Currency Formatting by Locale with Intl.NumberFormat
Intl.NumberFormat
Date and Time Formatting by Locale with Intl.DateTimeFormat
Intl.DateTimeFormat
Intl.NumberFormat Basics: Locale-Aware Number Formatting
Intl.NumberFormat
Locale Fallback Chain: How Browsers Resolve Locale Requests
Advanced
Collation and Sorting by Locale with Intl.Collator
Intl.Collator