jackocnr

intl-tel-input

# International Telephone Input [](https://github.com/jackocnr/intl-tel-input/actions/workflows/ci.yml) <img src="https://img.shields.io/github/package-json/v/jackocnr/intl-tel-input.svg" alt="version"/> <img src="https://img.shields.io/npm/dm/intl-tel-input.svg" alt="downloads"/> [](https://badges.nerdydata.com/719de9d2-d0e7-4988-b02f-9f9d52687076/report) For entering, formatting, and validating international telephone numbers. Available in vanilla JavaScript, or as React, Vue, Angular, and Svelte components. [Explore docs »](https://intl-tel-input.com/docs/integrations) <picture> <source media="(prefers-color-scheme: dark)" srcset="https://raw.github.com/jackocnr/intl-tel-input/master/screenshots/iti-github-dark.png"> <source media="(prefers-color-scheme: light)" srcset="https://raw.github.com/jackocnr/intl-tel-input/master/screenshots/iti-github-light.png"> <img width="271" height="279" alt="intl-tel-input screenshot showing country dropdown open" src="https://raw.github.com/jackocnr/intl-tel-input/master/screenshots/iti-github-light.png"> </picture> ## Sponsored by <img src="https://raw.github.com/jackocnr/intl-tel-input/master/screenshots/twilio.webp" height="100" alt="Twilio"/> Use [Twilio's API to build phone verification, SMS 2FA, appointment reminders, marketing notifications and so much more](https://www.twilio.com/blog/international-telephone-input-twilio?utm_source=github&utm_medium=referral&utm_campaign=intl_tel_input). We can't wait to see what you build. ## Resources Check out the [website](https://intl-tel-input.com), where you can find [a full set of docs](https://intl-tel-input.com/docs/integrations), a [live playground](https://intl-tel-input.com/playground/) where you can try out all of the options, as well as plenty of [examples](https://intl-tel-input.com/examples/vanilla-javascript/validation) of different setups. ## Features 🔍 **Fast country picking** * Search by country name or dial code * Full keyboard navigation ✨ **Smart defaults** * Optionally auto-detect the user's country * Example placeholders per country 📞 **Formatting & output** * Formats the number as the user types * Extract standard E.164 numbers to store 🛡️ **Validation** * Validate numbers with specific error types * Only allow valid digits and enforce max length 🌍 **International & accessible** * Translated into 40+ languages * Support for RTL and alternative numerals * Screen reader-friendly ARIA markup 🎛️ **Developer-friendly** * Override CSS variables (e.g. dark mode) * Extensive initialisation options * TypeScript definitions included ## Contributing See the [contributing guide](https://github.com/jackocnr/intl-tel-input/blob/master/.github/CONTRIBUTING.md) for instructions on setting up the project and making changes, and also on how to update the flag images, or how to add a new translation. ## Attributions * Flag images from [flag-icons](https://github.com/lipis/flag-icons) * Original country data from mledoze's [World countries in JSON, CSV and XML](https://github.com/mledoze/countries) * Formatting/validation/example number code from [libphonenumber](https://github.com/googlei18n/libphonenumber) User testing powered by [BrowserStack Open-Source Program](https://www.browserstack.com/open-source) ## License MIT