smucode / react-world-flags

Easy to use SVG flags of the world for react
https://smucode.github.io/react-world-flags/
MIT License
146 stars 40 forks source link
flags react reactjs svg svg-flags world

CircleCI

react-world-flags

Easy to use SVG flags of the world for react

Demo

Installation

npm install react-world-flags

Usage

import Flag from 'react-world-flags'

<Flag code={ code } />

Where code is the two letter, three letter or three digit country code.

You can also pass an optional fallback which renders if the given code doesn't correspond to a flag:

import Flag from 'react-world-flags'

<Flag code="foo" fallback={ <span>Unknown</span> }/>

All props but code and fallback are passed through to the rendered img

<Flag code="nor" height="16" />

// <img src="https://github.com/smucode/react-world-flags/raw/master/data:image/svg+xml..." height="16">

Caveat

The bundle contains all flags of the world and is about 1.3 MB gzipped.

SVG's are inlined using Data_URIs.