JSFiddle - React, Tailwind, and code Playground

by Lucas Costa

HTML

<form>
  <label for="choose">Qual seu telefone?</label>
  <input id="choose" name="i_like" pattern="[0-9]{2}-[0-9]{5}-[0-9]{4}" required>
  <button>Enviar</button>
</form>

CSS

input:invalid {
  border: 1px solid red;
}

input:valid {
  border: 1px solid green;
}