JSFiddle - React, Tailwind, and code Playground
HTML
<form action="">
<input type="text" pattern="[0-9]{3}\.[0-9]{3}\.[0-9]{3}\-[0-9]{2}" value="" name="cpf" id="cpf" maxlength="17" placeholder="CPF">
</form>
<form action="">
<input type="text" pattern="[0-9]{3}\.[0-9]{3}\.[0-9]{3}\-[0-9]{2}" value="" name="cpf" id="cpf" maxlength="17" placeholder="CPF">
</form>