Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Dropdown Menu - Language Selector
A React language selector dropdown with country flag emojis and language names using DropdownMenuRadioGroup for i18n
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
Global apps need localization—language selectors let users choose their preferred interface language instantly. This React language selector uses shadcn/ui DropdownMenu with Languages icon trigger featuring country flags (US, Spain, France, Germany, Japan, China) and native language names using Lucide React and DropdownMenuRadioGroup. Built with Radix UI primitives and useState managing language state. The language selector pattern improves accessibility—perfect for international SaaS, e-commerce platforms, documentation sites, or anywhere multilingual users need quick language switching.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
Theme Selector
Light, Dark, System theme options
Multi-Account Switcher
Switch between multiple contexts
Radio Group Dropdown
Single selection menu pattern
Select Component
Alternative language selection UI
Combobox Component
Searchable language picker
Button Component
Language toggle button
Questions you might have
React Dropdown Menu - Theme Selector
A React theme selector dropdown with Light, Dark, and System options using DropdownMenuRadioGroup and theme icons
React Dropdown Menu - Preferences Dropdown
A React editor preferences dropdown with DropdownMenuCheckboxItem toggles for Auto-save, Spell Check, Line Numbers, Word Wrap, and Minimap