Tag Input
Animated tag management ΓÇö press Enter or comma to add, backspace to remove.
Component Showcase
Choose Installation Method
Select how you want to add this component to your project
Run command in your project root
$ npx @melonui-dev/cli add tag-input
How to import and use
app/page.tsx
import { TagInput } from "@/components/tag-input";
export default function Page() {
return (
<main className="flex min-h-screen items-center justify-center bg-[#050505] p-8">
<TagInput />
</main>
);
}AI Automation Agent Prompt
Feed this prompt to Claude, ChatGPT, or Gemini to quickly write custom integrations, layouts, or configure props for this component on your system.
I want to integrate the MelonUI "Tag Input" component into my project.
To add it, run the command: `npx @melonui-dev/cli add tag-input`
Please import and merge this component into my project, and write the code showing how to customize its parameters and content.