Champ souligné
Un champ minimal avec une simple ligne ; au focus, un trait en dégradé s'étend depuis le centre.
Réglages
Code
<label class="uv-il"><input placeholder="Votre nom"><i></i></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
Un champ souligné garde la page épurée, c'est pourquoi les designers l'aiment pour les formulaires courts et élégants : le champ « Votre nom » d'une réponse à un faire-part de mariage, le contact du portfolio d'un photographe ou l'e-mail de la newsletter d'un restaurant. Pas de cadre, juste un filet. Au clic, un trait coloré s'ouvre depuis le milieu.
Certaines personnes ne reconnaissent pas une simple ligne comme un champ : gardez ces formulaires courts et évidents. Le placeholder disparaît dès la saisie ; au-delà de deux champs, ajoutez un libellé visible au-dessus de chacun.