← Voltar à biblioteca
Formulários

Seletor de data

Date picker

Ajuda a escolher uma data por digitação ou calendário.

Exemplo didático · Experimente os controles acima

Quando usar

Selecionar datas em agendamentos e filtros.

Cuidados e acessibilidade

Informe o formato esperado; na interface brasileira, apresente datas em dia, mês e ano.

Partes e comportamento

Campo de data, controle de calendário e limites mínimo e máximo quando necessários.

Não confunda

Calendário de agenda exibe acontecimentos. Date picker seleciona uma data.

Exemplo de código

<label for="data">Data do evento</label>
<input type="date" id="data" name="data">

Trecho didático. Integre e teste no contexto do seu projeto.

Peça assim para uma IA

BIBLIOTECA UI / EXPLORAR