What it does
flag-icons is a collection of country flag SVGs with CSS helpers. It supports standard 4:3 and square 1:1 flags, country-code classes and Sass configuration for selected countries.
Use flag-icons for country-based information such as shipping destinations or a regional data table. The website has continent filters and a separate non-ISO group. Clicking a flag copies its HTML code.
Install flag-icons with npm and import flag-icons/css/flag-icons.min.css. Add fi fi-us to an empty span for the United States flag; add fis for the square version. Other ISO flags follow the same pattern with the lowercase two-letter country code. Keep the country name beside the symbol, as the site’s examples do.
A Sass build can set $flag-icons-included-countries to the codes needed by the product. This limits the included countries instead of bringing the entire collection into that stylesheet. The SVGs and CSS are free under MIT, with copyright and permission notices retained when distributing the project’s files.
Strengths
- Country-code classes connect flags to application data.
- Sass configuration can limit the included countries.
Best for
- Shipping-country lists.
- Country-oriented data tables.
Sources
- flag-icons: Free Country Flags in SVG (Oct 27, 2026)
- flag-icons (Oct 27, 2026)
- flag-icons: The MIT License (Oct 27, 2026)