As melhores bibliotecas React para input de telefone de 2025

ProdutoPor Juliana Amorim

Coletar números de telefone é uma necessidade básica de qualquer site. Mas desenvolver campos de formulário com suporte a internacionalização e localização não é nada simples.

Abaixo está uma lista das bibliotecas de input de número de telefone mais populares, ordenadas da mais para a menos usada, com base em stars no GitHub e downloads semanais no npm em maio de 2025.

Input de telefone
Input de telefone

Bibliotecas de input de telefone React

Aqui está uma visão geral das bibliotecas de input de números de telefone React mais usadas:

BibliotecaRepositórioPacoteStars no GitHubdownloads npm
react-phone-number-input GitLabnpm135804 mil
react-phone-input-2GitHubnpm981376 mil
react-international-phoneGitHubnpm379180 mil
react-intl-tel-inputGitHubnpm28538 mil
react-headless-phone-inputGitHubnpm41220
react-phone-input-beautifyGitHubnpm424
Gerencie seus componentes com um CMS para componentes

A Croct ajuda times de produto a escalar experimentação e personalização sem sobrecarregar desenvolvedores.

react-phone-number-input

RepositórioPacoteStars no GitHubdownloads npm
🔗 Link🔗 Link135804 mil

react-phone-number-input é uma biblioteca popular focada em fornecer validação e formatação robusta e internacional de números de telefone usando o poderoso mecanismo libphonenumber-js. Sua UI minimalista facilita a integração em qualquer sistema de design, enquanto sua API simples garante que os desenvolvedores possam implementar entradas telefônicas precisas com configuração mínima. O componente suporta seleção de país e modos de entrada simples, tornando-o versátil para uma variedade de casos de uso onde a correção e a facilidade de uso são fundamentais.

react-phone-input-2

RepositórioPacoteStars no GitHubColaboradoresdownloads npm
🔗 Link🔗 Link98170376 mil

react-phone-input-2 se destaca por sua interface altamente personalizável e visualmente envolvente, apresentando um seletor de país com ícones de bandeira e formatação automática com base no país selecionado. Ele oferece amplas opções de estilo, suportando temas como Material UI, Bootstrap e muito mais, permitindo integração perfeita em aplicativos de marca. Com um rico conjunto de acessórios para comportamento e aparência, esta biblioteca é ideal para projetos que priorizam uma experiência de usuário interativa e refinada junto com a internacionalização.

react-international-phone

SiteRepositórioPacoteStars no GitHubColaboradoresdownloads npm
🔗 Link🔗 Link🔗 Link37913180 mil

react-international-phone é uma solução leve e direta para lidar com entradas de números de telefone internacionais. Embora não possua recursos avançados, como um seletor de país, sua simplicidade e facilidade de integração o tornam uma boa opção para projetos menores ou cenários onde uma entrada telefônica básica e simples é suficiente. O componente suporta formatos internacionais, garantindo que os usuários possam inserir números de telefone de vários países sem complexidade desnecessária.

react-intl-tel-input

RepositórioPacoteStars no GitHubColaboradoresdownloads npm
🔗 Link🔗 Link2854738 mil

react-intl-tel-input oferece uma experiência de usuário familiar e intuitiva com seu seletor suspenso de país e formatação automática de entrada. Ele equilibra riqueza de recursos e facilidade de uso, oferecendo opções moderadas de personalização e validação confiável. Esta biblioteca é uma escolha sólida para projetos que desejam um componente de entrada de telefone clássico e fácil de usar, com suporte internacional e integração direta.

react-headless-phone-input

RepositórioPacoteStars no GitHubColaboradoresdownloads npm
🔗 Link🔗 Link412220

react-headless-phone-input oferece uma abordagem totalmente headless, dando aos desenvolvedores controle completo sobre a UI, ao mesmo tempo que fornece validação e formatação robustas nos bastidores. Ele gera números de telefone no formato padrão e164 e foi projetado para máxima usabilidade e flexibilidade. Essa biblioteca é mais adequada para equipes que desejam criar uma experiência de entrada de telefone personalizada do zero, aproveitando uma forte lógica de validação sem estar vinculada a nenhuma implementação de UI específica.

react-phone-input-beautify

RepositórioPacoteStars no GitHubColaboradoresdownloads npm
🔗 Link🔗 Link4424

react-phone-input-beautify foi projetado para desenvolvedores que precisam de validação avançada e integração profunda de formulários, oferecendo fortes recursos de acessibilidade e compatibilidade com bibliotecas de formulários populares. Sua UI moderna e acessível foi construída com suporte ARIA, garantindo inclusão para todos os usuários. A biblioteca oferece opções de personalização abrangentes, tornando-a adequada para equipes que buscam criar campos de entrada de telefone robustos, acessíveis e visualmente atraentes para formulários complexos.

Como escolher?

A escolha da biblioteca certa depende de fatores como necessidades de design, flexibilidade de personalização, considerações de desempenho e integração com outras ferramentas. Desenvolvedores React têm várias bibliotecas robustas para escolher, cada uma com seus pontos fortes em internacionalização, validação, experiência do usuário e personalização.

A biblioteca react-phone-number-input utiliza a biblioteca padrão da indústria libphonenumber-js para analisar e formatar números de telefone de qualquer país, garantindo que os usuários sempre insiram números válidos e formatados corretamente.

Com o template da Croct, essa funcionalidade é pré-integrada com um CMS para que você possa gerenciar, personalizar e testar AB seus formulários sem deploys e customizações extras.

Vamos crescer juntos!

Descubra as táticas que nossos clientes usam para crescer 20% ou mais.