JSFiddle - React, Tailwind, and code Playground

HTML

<form action="sua_açao_aqui">
  Username: <input type="text" name="nome" placeholder="Nome" pattern="^[a-zA-Z][a-zA-Z0-9-_\.]{1,20}$" required>
  <input type="submit">
</form>