diseño×css×
HTML + CSSInputs
Tag input
Press Enter to turn a word into a tag; click its × or hit backspace to remove it with a small shrink.
Settings
16px
1x
Code
<div class="uv-in2g2"><span class="tg">design<i>×</i></span><span class="tg">css<i>×</i></span><input placeholder="Type and press Enter"></div>Prompt for AI
Paste it into ChatGPT, Claude or Cursor and it will adapt the block to your project with these settings, even if you don’t use React.
More in Inputs
Where to use it
Tag inputs fit anywhere people add several short items at once: skills on a job profile, keywords for a blog post, ingredients to exclude on a recipe site or labels in a task manager. Each tag pops in as a coloured chip and shrinks away when removed. A tags input in HTML, CSS and a bit of JavaScript.
In this version only Enter creates a tag, not commas, so mention it in the placeholder as the demo does. If there is a fixed list of options behind the scenes, suggestions will serve people better than free typing.