Country Selection Dropdown

A country selector with flag emojis for quick visual identification and improved international user experience.

Select from a global list of countries with flag emojis alongside country names. Ideal for shipping forms, billing addresses, and user registration flows.

Scroll to load preview

Installation

Install

Pro block

npx shadcn@latest add https://www.shadcn.io/r/form-country-select.json

npx shadcn@latest add https://www.shadcn.io/r/form-country-select.json

pnpm dlx shadcn@latest add https://www.shadcn.io/r/form-country-select.json

bunx shadcn@latest add https://www.shadcn.io/r/form-country-select.json

Select Basic

Basic dropdown select form

Select Grouped

Grouped options in a select dropdown

Select Searchable

Searchable combobox dropdown

Multi Select

Multi-select with checkbox popover

Cascading Select

Dependent cascading dropdowns

Timezone Select

Timezone selector with UTC offsets

FAQ

Last updated on March 24, 2026

Was this page helpful?

Conditional Fields Form

A form where certain fields appear or disappear based on select values using React Hook Form's watch function

Credit Card Input Form

A credit card payment form with formatted card number input, expiry date, and CVC fields with proper input masking and validation.

Country Selection Dropdown