**[ This description is mirrored from README.md at [github.com/Protoss78/flag-icon](https://github.com//Protoss78/flag-icon/blob/v0.12.0/README.md) on 2019-05-22 ]** flag-icon =========== A collection of SVG flags, conveniently usable as a Polymer Web Component. If you don't care about extra features, a simple CSS implementation of country flags can be found at https://github.com/lipis/flag-icon-css Typical file sizes: > **SVG** files: **2kb** to **75kb** * Images come from [famfamfam](http://www.famfamfam.com/lab/icons/flags/) icon library, or generated from SVG. * SVGs come from [Wikimedia Commons](http://commons.wikimedia.org/wiki/Category:SVG_sovereign_state_flags). * [ISO 3166-1 Country Code](http://en.wikipedia.org/wiki/ISO_3166-1) list is available on Wikipedia. ## Component Page [API Documentation and Demo](http://protoss78.github.io/flag-icon/) ## Usage 1. Add the library using the Javascript package manager [Bower](http://bower.io/): ```bower install --save flag-icon``` 2. Import Web Components' polyfill: ```html ``` 3. Import Custom Element: ```html ``` 4. Start using it! ```html Flag of Canada ``` 5. Or use it unrendered in scripts: ```javascript var f = new FlagIcon(); //get country info f.findCountry('canada') //> { name: 'Canada', alpha2: 'CA', alpha3: 'CAN', numeric: 124 } //convert between 2 -> 3 letter character codes f.findCountry('ca').alpha3 //> 'CAN' //get full names of states or provinces f.findUSState('ca') //> { name: 'California', iso: 'US-CA', alpha2: 'CA', numeric: 6, gpo: 'Calif.' } f.findCanadianProvince('ON') //> { name: 'Ontario', alpha2: 'ON' } ``` ## Options Attribute | Type | Default | Description --- | --- | --- | --- `key` | *string* | `null` | Proper, common, ISO 3166-1 alpha-2, alpha-3, or country code `au` | *boolean* | `false` |  Australian State flags `br` | *boolean* | `false` |  Brazilian State flags `ca` | *boolean* | `false` |  Canadian Province and Territory flags `de` | *boolean* | `false` |  German State flags `es` | *boolean* | `false` |  Spain Autonomous Community flags `ru` | *boolean* | `false` |  Russian Republics, Krais, and Oblast flags `us` | *boolean* | `false` |  US State flags `maritime` | *boolean* | `false` | Maritime and ICS flags `racing` | *boolean* | `false` | NASCAR and IndyCar racing flags `square` | *boolean* | `false` | Use square version instead of 4:3 aspect (only valid for country flags) `aspect` | *float* | | Override aspect ratio used to render the flag ## Aspect Ratios for Flags Flags come in all different shapes and sizes, attempts were made to standardize to the following aspect ratios (width:height) Attribute | Aspect --- | --- Country | 4:3 Austrialia | 2:1 Brazil | 3:2 Canada | 2:1 Germany | 5:3 Spain | 3:2 US | 3:2 Russia | 3:2 NASCAR, IndyCar | 4:3 Maritime | 1:1 ## Todo - Loading notification, or default image. - Compact/minify SVG files ## History For detailed changelog, check [Releases](https://github.com/stevenrskelton/flag-icon/releases). ## License [MIT License](http://opensource.org/licenses/MIT) © Steven Skelton