diseño×css×
HTML + CSSEingabefelder

Eingabefeld für Tags

Mit Enter wird ein Wort zum Tag; per × oder Rücktaste verschwindet es mit einem kleinen Schrumpfen.

Einstellungen

16px
1x

Code

<div class="uv-in2g2"><span class="tg">Design<i>×</i></span><span class="tg">css<i>×</i></span><input placeholder="Eingeben und Enter drücken"></div>

Prompt für KI

Füg ihn in ChatGPT, Claude oder Cursor ein und der Baustein wird mit diesen Einstellungen an dein Projekt angepasst, auch ohne React.

Mehr aus Eingabefelder

Wofür du ihn nutzen kannst

Ein Tag-Feld passt überall, wo man mehrere kurze Einträge hinzufügt: Skills im Bewerberprofil, Schlagwörter für einen Blogartikel, Zutaten, die man auf einer Rezeptseite ausschließen will, oder Labels in einer Aufgabenverwaltung. Jeder Tag springt als farbiger Chip herein und schrumpft beim Entfernen weg. Ein Tags-Input in HTML, CSS und etwas JavaScript.

In dieser Version erzeugt nur Enter einen Tag, kein Komma. Schreib das in den Platzhalter, wie in der Demo. Steht im Hintergrund eine feste Liste, helfen Vorschläge mehr als freies Tippen.