Country symbol
Country symbols display an icon that represents the flag of a country or territory. You can use country symbols individually or as a complete package. The country symbols are abstractly stylized, so users are more likely to recognize them at smaller sizes. Though we maintain their character within the circular form, we also provide rectangular "sharp" versions for every country symbol.
To reduce the core package's bundle size, country symbols are in a separate package that you should first install using:
npm install @salt-ds/countries or yarn add @salt-ds/countries
When you need to display an icon that represents the flag of a country or intergovernmental organization.
When representing languages, national currencies or telephone country codes.
While the ISO country codes do correlate with top-level domains (TLD) on the internet, for example, they don't always map perfectly to languages, national currencies or telephone country codes. So, sometimes they may not be the best corresponding visuals, given cultural, historical and political sensitivities. Regardless, since the symbols are decorative, there must be correct labels and accessible text to convey the information.
To import an individual country symbol from the countries Salt package, use its country code:
To import LazyCountrySymbol from the countries Salt package, use:
To import a "sharp" variant from the countries Salt package, append _Sharp to the desired country code:
To reduce the core package's bundle size, country symbols are in a separate package that you should first install using:
npm install @salt-ds/countries or yarn add @salt-ds/countries
When you need to display an icon that represents the flag of a country or intergovernmental organization.
When representing languages, national currencies or telephone country codes.
While the ISO country codes do correlate with top-level domains (TLD) on the internet, for example, they don't always map perfectly to languages, national currencies or telephone country codes. So, sometimes they may not be the best corresponding visuals, given cultural, historical and political sensitivities. Regardless, since the symbols are decorative, there must be correct labels and accessible text to convey the information.
To import an individual country symbol from the countries Salt package, use its country code:
To import LazyCountrySymbol from the countries Salt package, use:
To import a "sharp" variant from the countries Salt package, append _Sharp to the desired country code:
To reduce the core package's bundle size, country symbols are in a separate package that you should first install using:
npm install @salt-ds/countries or yarn add @salt-ds/countries
When you need to display an icon that represents the flag of a country or intergovernmental organization.
When representing languages, national currencies or telephone country codes.
While the ISO country codes do correlate with top-level domains (TLD) on the internet, for example, they don't always map perfectly to languages, national currencies or telephone country codes. So, sometimes they may not be the best corresponding visuals, given cultural, historical and political sensitivities. Regardless, since the symbols are decorative, there must be correct labels and accessible text to convey the information.
To import an individual country symbol from the countries Salt package, use its country code:
To import LazyCountrySymbol from the countries Salt package, use:
To import a "sharp" variant from the countries Salt package, append _Sharp to the desired country code: