Flags
Flags in combination with the name of a country can help the user to find a country in a list of many countries. However, flags should be used with care, since flags are not suitable for all contexts.
Component meta
Component identifier
- pattern-flags
Tags
- Global
Design principles
- It's for you
Guidelines
Short description
Flags might be used on country selector pages to help customers find what they’re looking for faster. Without flags, it might take a bit longer to find a country if the list is extensive.
When and how to use it
Use flags for choosing elements like delivery or visiting addresses, phone numbers or location-based web sites.
Preferably, use flags in combination with the full name of the country, since not all customers might recognise all flags.
Example when flags are used for stock market indexes
Avoid using flags to represent languages since flags represent countries, or parts of countries. Languages and countries do not have a one-to-one relationship. A language is spoken in multiple countries, and a country can have multiple official languages. Language can be very personal and is a big part of people’s cultures.
Avoid using flags to represent currencies. Countries don’t always have a simple relationship. Many countries keep their savings in foreign currencies that are more stable than theirs. Many payers and payees also prefer payments in more stable currencies.
Brand manual
Scroll to Pictogram Library to download the flag pictograms in Brand manual.
Do's and don'ts
- Use both flags and the name of the country in text.
- Put the flag before the name of the country.
- Never use flags for selection of languages or currencies.