Formulários
Campo com sugestões
Combobox / Autocomplete
Combina digitação com uma lista de sugestões selecionáveis.
Exemplo didático · Experimente os controles acima
Quando usar
Encontrar valores em listas grandes de cidades, pessoas ou produtos.
Cuidados e acessibilidade
Implemente foco, setas, seleção e anúncio de resultados; não basta adicionar o role.
Partes e comportamento
Campo, lista de opções, opção ativa e estado de expansão.
Não confunda
Um campo de busca livre não precisa ter uma lista de opções selecionáveis.
Exemplo de código
<!-- Sugestões nativas; teste suporte no público do seu projeto. -->
<label for="cidade">Cidade</label>
<input id="cidade" list="cidades">
<datalist id="cidades">
<option value="Fortaleza"></option>
<option value="São Paulo"></option>
</datalist>Trecho didático. Integre e teste no contexto do seu projeto.