<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/16.0.11/css/intlTelInput.css" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/16.0.11/js/intlTelInput.min.js"></script> <div class="input-field"> <input type="tel" id="intl_phone_number" minlength="10" /> </div> <script> const phoneInputField = document.querySelector("#intl_phone_number"); const phoneInput = window.intlTelInput(phoneInputField, { separateDialCode: true, hiddenInput: "phoneno", utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/16.0.11/js/utils.js" }); </script>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter