Skip to Content

Input

Displays a form input field or a component that looks like an input field.

With Label

With Button

AI variant

The AI input is a composition, not a base Input prop: the standard Input sits inside a wrapper that adds a subtle gradient inset glow and the AI mark (with a tooltip). The wrapper owns the box and focus ring so overflow-hidden can clip the glow without clipping the ring. See the AI Toolkit for the pattern and guidance.

Installation

npx shadcn@latest add @uipath/input

Usage

import { Input } from "@/components/ui/input"
<Input type="email" placeholder="Email" />
Last updated on