JSFiddle - React, Tailwind, and code Playground
HTML
<form>
<input type="text" id="nombre" name="nombre" placeholder="Nombre" required/>
<p>*La primera letra debe ser la elegida por el jugador en turno.</p>
</form>
CSS
input:valid +p { display:none }
input:invalid +p {
display:block;
color: firebrick;
font-style: italic;
}
JavaScript
$("form").find("input[type=text]").attr("pattern", "(?=[Aa])(?!.*(.)\\1\\1).*");
// If I type any word that don't star with A, the message is displayed
// But if I type things like Aaaaaaa it doesn't shows