diseño×css×
HTML + CSSChamps
Champ de tags
Entrée transforme un mot en tag ; sa croix ou la touche retour le supprime en le faisant rétrécir.
Réglages
16px
1x
Code
<div class="uv-in2g2"><span class="tg">design<i>×</i></span><span class="tg">css<i>×</i></span><input placeholder="Saisir puis appuyer sur Entrée"></div>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 de tags convient partout où l’on ajoute plusieurs éléments courts : les compétences d’un profil candidat, les mots-clés d’un article de blog ou les ingrédients à exclure sur un site de recettes. Chaque tag apparaît en pastille colorée et rétrécit quand on l’enlève. Un champ de tags en HTML, CSS et un peu de JavaScript.
Dans cette version, seule la touche Entrée crée un tag, pas la virgule : précisez-le dans le placeholder comme la démo. S’il existe une liste fixe d’options, des suggestions aideront mieux qu’une saisie libre.