Components / Forms
Input
Collects a single line of user input.
Preview
We'll never share your email.
1import { Input } from "@/components/ui/input"2
3export function InputDemo() {4 return (5 <Input6 label="Email address"7 placeholder="name@example.com"8 9 />10 )11}error
The error style of this component.
Enter a valid email address.
1import { Input } from "@/components/ui/input"2
3export function InputDemo() {4 return (5 <Input6 label="Email address"7 placeholder="name@example.com"8 error="Enter a valid email address."9 10 />11 )12}disabled
The disabled style of this component.
We'll never share your email.
1import { Input } from "@/components/ui/input"2
3export function InputDemo() {4 return (5 <Input6 label="Email address"7 placeholder="name@example.com"8 disabled9 />10 )11}Installation
Add the source directly to your project with the shadcn CLI.
npx shadcn@latest add qentrah/DUI/inputUsage
Install the component, import it from your configured UI directory, and adapt the source to your product. Open the source panel under any example to copy that exact variant.