Champ e-mail avec validation
Il passe au vert avec une coche si l’e-mail est valide, sinon au rouge, avec une secousse et un message.
Réglages
Code
<label class="uv-in2v"><input placeholder="vous@exemple.fr"><span class="ic"><svg class="ok" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12.5l4.5 4.5L19 7.5" pathLength="1"/></svg><svg class="no" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.8" stroke-linecap="round"><path d="M6 6l12 12M18 6L6 18"/></svg></span><em class="hp">Saisissez une adresse e-mail valide</em></label>Prompt pour l’IA
Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.
Plus dans Champs
Où l’utiliser
Repérer une faute de frappe dans une adresse e-mail avant l’envoi évite bien des soucis. Placez-le dans l’inscription à la newsletter du pied de page, l’inscription d’une application ou la commande sans compte d’une boutique. La vérification se fait en quittant le champ ou avec Entrée, pas pendant la saisie. Un champ avec validation d’e-mail en HTML, CSS et JavaScript.
Il vérifie seulement le format, pas l’existence de l’adresse : validez aussi côté serveur. Réécrivez le message à votre façon ; « Il semble manquer quelque chose » est plus aimable qu’une erreur sèche.