react-native-flagly

React Native Flagly

This library provides easy-to-use React Native flag components, using ISO country (and some regional) codes as inputs.
The flags are largely based on lipis/flag-icons and adhere to ISO 3166-1 alpha‑2 codes (plus select subregional codes like ES-CT).

Installation

Install via Yarn or npm:

yarn add react-native-flagly
# or
npm install react-native-flagly

This package depends on react-native-svg. If you haven’t installed it, do so:

yarn add react-native-svg
# or
npx expo install react-native-svg

See their installation guide for additional details.

Usage

Import the <Flagly> component and specify the code prop, which supports uppercase or lowercase ISO-style region codes. Internally, it maps them to uppercase:

import React from 'react';
import { Flagly } from 'react-native-flagly';

export default function App() {
  return (
    <>
      {/* Using uppercase (default) */}
      <Flagly code="US" />

      {/* Using lowercase (also supported) */}
      <Flagly code="es-ct" />
    </>
  );
}

Use the size prop to control both width and height:

export default function App() {
  return <Flagly code="RO" size={32} />;
}

Properties

Property	Type	Default	Description
code	A string matching an ISO country/subregion code (e.g., "US", "ES-CT", etc.)	— (required)	Specifies which flag to render. The map uses uppercase codes internally, but lowercase input is accepted and normalized to uppercase.
size	number	24	Size for both width and height of the rendered flag.

Note: The actual list of supported codes is auto‑generated from the source flags, which are pulled from lipis/flag-icons. See that repository for further details about specific codes.