Intl Tel Input
For entering, formatting, and validating international telephone numbers. Available in vanilla JavaScript, or as React, Vue, Angular, and Svelte components.
Install / Use
npx skills add jackocnr/intl-tel-inputInstalls into whichever agent you are using.
README
International Telephone Input
<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"/>
For entering, formatting, and validating international telephone numbers. Available in vanilla JavaScript, or as React, Vue, Angular, and Svelte components.
<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. We can't wait to see what you build.
Resources
Check out the website, where you can find a full set of docs, a live playground where you can try out all of the options, as well as plenty of examples of different setups.
Features
🔍 Fast country picking
- Search by country name or dial code
- Full keyboard navigation
✨ Smart defaults
- 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 users to type valid digits and enforce max length
🌍 International & accessible
- Translated into 50+ languages
- Support for RTL and alternative numerals
- Screen reader-friendly ARIA markup
🎛️ Developer-friendly
- Theme it with CSS variables (e.g. dark mode) or utility classes like Tailwind
- TypeScript definitions included
Contributing
See the contributing guide 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
- Original country data from mledoze's World countries in JSON, CSV and XML
- Formatting/validation/example number code from libphonenumber
User testing powered by BrowserStack Open-Source Program
License
MIT
Related Skills
node-connect
385.5kDiagnose OpenClaw Android, iOS, or macOS node pairing, QR/setup code, route, auth, and connection failures.
imsg
385.5kUse the imsg CLI from OpenClaw agents for iMessage/SMS DMs, groups, replies, reactions, polls, watching, and private-API actions.
Writing Hookify Rules
140.7kThis skill should be used when the user asks to "create a hookify rule", "write a hook rule", "configure hookify", "add a hookify rule", or needs guidance on hookify rule syntax and patterns.
Agent Development
140.7kThis skill should be used when the user asks to "create an agent", "add an agent", "write a subagent", "agent frontmatter", "when to use description", "agent examples", "agent tools", "agent colors", "autonomous agent", or needs guidance on agent structure, system prompts, triggering conditions, or…
