Flagcn

Overview

Flagcn is a shadcn registry of 306 accessible React flag components, plus country, phone, language and currency components built on them. Every item copies editable source into a project, and there is no Flagcn runtime package. @flagcn is listed in the official shadcn Registry Directory, so current shadcn CLI releases resolve it without a local registry entry.

Flags are available as SVG, PNG, WebP or JPEG, framed at 4:3, square or original ratio. The site includes a searchable flag catalog and machine-readable references for coding agents, including an llms.txt, an AGENTS.md and an OpenAPI description of the registry.

Features

• 306 flags: One registry item per flag, including subdivisions such as England, Scotland and Wales, and the EU flag.
• Multiple formats and ratios: SVG, PNG, WebP and JPEG in 4:3, 1:1 and original frames.
• Pickers: Flag picker, country picker, country select, language picker and currency picker.
• Phone input: International phone input with calling codes, using libphonenumber-js.
• Display components: Country badge and flag avatar.
• Collections: Bundles such as GCC and EU collections, or @flagcn/all for everything.
• Country data: Country data and calling code items for building custom components.

Tech stack

• React, shadcn/ui
• libphonenumber-js, Tabler Icons

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @flagcn/component-name