# country-flag-icons [![npm version](https://img.shields.io/npm/v/country-flag-icons.svg?style=flat-square)](https://www.npmjs.com/package/country-flag-icons) [![npm downloads](https://img.shields.io/npm/dm/country-flag-icons.svg?style=flat-square)](https://www.npmjs.com/package/country-flag-icons) Vector country flag icons in `3:2` aspect ratio. * Optimized for small size on screen (little detail, minimalism). * Small file size. * Comes with React components for all flags (exported from `/react` subpackage). [See `3:2` flags](http://catamphetamine.gitlab.io/country-flag-icons/3x2) ## Install ``` npm install country-flag-icons --save ``` ## API ### `hasFlag(country: string): boolean` Tells whether there's a flag for a country. ```js import { hasFlag } from 'country-flag-icons' hasFlag('US') === true hasFlag('ZZ') === false ``` ### `countries: string[]` The list of supported countries. ```js import { countries } from 'country-flag-icons' countries.includes('US') === true countries.includes('ZZ') === false ``` ### Web Flags can be linked directly from this library's [gitlab pages website](https://catamphetamine.gitlab.io/country-flag-icons), or from a [github pages mirror](https://purecatamphetamine.github.io/country-flag-icons), which seems a tiny bit faster. ```html

``` Flags can also be used in the form of CSS classes imported from [`country-flag-icons/3x2/flags.css`](https://unpkg.com/country-flag-icons/3x2/flags.css) where all flag icons are inlined as `background-image` data URLs. CSS flag icon height can be set via `--CountryFlagIcon-height` [CSS variable](https://caniuse.com/#feat=css-variables).

What if my project doesn't use CSS variables?

#### In that case, the default flag icon height is `1em`, and to change it, just set a `font-size`: ```css /* Set flag icon height to 24px. */ [class*=' flag:'], [class^='flag:'] { font-size: 24px; } ```

### Unicode [Unicode flag icons](https://blog.emojipedia.org/emoji-flags-explained/) are available under the `/unicode` export. ```js import getUnicodeFlagIcon from 'country-flag-icons/unicode' getUnicodeFlagIcon('US') === '🇺🇸' getUnicodeFlagIcon('ZZ') === '🇿🇿' ``` Unicode flag icons ("Regional Indicator Symbols") were [introduced](https://esham.io/2014/06/unicode-flags) in 2010 in Unicode version 6.0. Older operating systems might not support Unicode flags, either rendering "missing" (rectangle) characters (if their system doesn't support country flags), or displaying two-letter country codes instead of emoji flag images. For example, Windows 10 currently (01.01.2020) doesn't support Unicode country flags, and displays two-letter country codes instead of emoji flag images. ### React React components for all flags are available at `/react/3x2` export. ```js import { US } from 'country-flag-icons/react/3x2' ``` Or directly, if your bundler doesn't support tree shaking: ```js import US from 'country-flag-icons/react/3x2/US' ``` ### Vue There's an [experimental component](https://gitlab.com/catamphetamine/country-flag-icons/-/issues/26) for Vue 3. ### String All flags can also be imported as strings: ```js import { US } from 'country-flag-icons/string/3x2' console.log(US) // > '

Paquete	Descargas	Stars	Tamaño	Issues	Publicación	Licencia

country-flag-icons	1,030,424	-	6.52 MB	-	hace 2 meses	MIT