react-flagkit

Beautiful flag icons for usage in React webapps. All flags are provided as importable images by React.

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
react-flagkit
2.0.43 years ago6 years agoMinified + gzip package size for react-flagkit in KB

Readme

react-flagkit
Beautiful flag icons for usage in React webapps. All flags are provided as importable images by React.

Documentation

Installation

npm install --save react-flagkit

Usage

import Flag from 'react-flagkit';

export default () => <Flag country="US" />;

Displays the flag of the United States (US)
<Flag country="US" />

Component can render different flags by country, a list of all codes can be found here.
<Flag country="DE" />

It's also possible to make those flags whatever pixel size you want.
Big
<Flag country="CA" size={84} />

or small
<Flag country="GB" size={15} />

If needed you can also make the flag interactive with an onClick handler, just make sure to change the role to button
<Flag
  country="SE"
  role="button"
  onClick={() => {
    alert('You just clicked on the flag.');
  }}
/>

Thanks

  • madebybowtie for FlagKit
  • jsDelivr for free CDN access