Como Limitar O Usuário a Escolher Um Tipo De Arquivo No HTML

Em nosso dia a dia de desenvolvimento, as vezes precisamos fazer upload de arquivos, como imagens, PDFs, etc.
Esses arquivos, muitas das vezes, queremos que seja apenas de um determinado tipo, apenas um tipo de arquivo!
Você sabe como limitar extensão de um arquivo, pelo HTML?

Para limitarmos o tipo de arquivo que será aceito pela nossa interface, basta alterarmos uma propriedade no nosso input file:

Limitando apenas imagens

<input type="file" multiple accept="image/*" />

Limitando apenas PDFs

<input type="file" multiple accept="application/pdf" />

Limitando apenas arquivos de texto

<input
  type="file"
  multiple
  accept="application/pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document"
/>

Com isso, podemos limitar que o usuário veja apenas um tipo de extensão de arquivo, através de nossa interface!
O ideal é que mesmo limitando isso, ainda verificarmos se é realmente aquele tipo pelo Javascript e se possível, verificar no back-end também!